@charset "UTF-8";

/*加载字体*/
@font-face {
    font-family: 'dinreg';
    src: url("../fonts/DINPro-Regular.otf");
}

@font-face {
    font-family: 'dinmed';
    src: url("../fonts/DINPro-Medium.ttf");
}

@font-face {
    font-family: 'dinbold';
    src: url("../fonts/DINPro-Bold.ttf");
}

@font-face {
    font-family: 'symed';
    src: url("../fonts/SOURCEHANSANSCN-MEDIUM.OTF");
}

* {
    outline: none;
}

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
form,
fieldset,
p,
blockquote,
th,
td,
header,
main,
footer,
aside,
section,
article,
nav {
    padding: 0;
    margin: 0;
}

fieldset,
img {
    border: 0;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

ol,
ul {
    list-style-type: none;
}

address,
caption,
cite,
code,
dfn,
em,
th,
var {
    font-weight: normal;
    font-style: normal;
}

caption,
th {
    text-align: left;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: normal;
    font-size: 100%;
}

p:before,
q:after {
    content: '';
}

abbr,
acronym {
    border: 0;
}

a {
    text-decoration: none;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.clr {
    HEIGHT: 0px;
    VISIBILITY: hidden;
    CLEAR: both;
    FONT-SIZE: 0px;
    OVERFLOW: hidden;
    width: 100%;
}

body,
samp {
    FONT-SIZE: 12px;
    color: #000;
    font-family: '微软雅黑', 'Microsoft YaHei', "Arial", 'SimSun', Serif;
}

img {
    vertical-align: bottom;
}

input[type="text"],
input[type="hidden"],
input[type="button"],
input[type="radio"],
input[type="submit"],
input[type="password"],
button,
textarea,
select {
    outline: none;
    border: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0;
}

.mCustomScrollbar {
    -ms-touch-action: none;
    touch-action: none;
}

.mCustomScrollbar.mCS_no_scrollbar {
    -ms-touch-action: auto;
    touch-action: auto;
}

.mCustomScrollBox {
    position: relative;
    overflow: hidden;
    height: 100%;
    max-width: 100%;
    outline: 0;
    direction: ltr;
}

.mCSB_container {
    overflow: hidden;
    width: auto;
    height: auto;
}

.mCSB_inside>.mCSB_container {
    margin-right: 30px;
}

.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden {
    margin-right: 0;
}

.mCS-dir-rtl>.mCSB_inside>.mCSB_container {
    margin-right: 0;
    margin-left: 30px;
}

.mCS-dir-rtl>.mCSB_inside>.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden {
    margin-left: 0;
}

.mCSB_scrollTools {
    position: absolute;
    width: 16px;
    height: auto;
    left: auto;
    top: 0;
    right: 0;
    bottom: 0;
}

.mCSB_outside+.mCSB_scrollTools {
    right: -26px;
}

.mCS-dir-rtl>.mCSB_inside>.mCSB_scrollTools,
.mCS-dir-rtl>.mCSB_outside+.mCSB_scrollTools {
    right: auto;
    left: 0;
}

.mCS-dir-rtl>.mCSB_outside+.mCSB_scrollTools {
    left: -26px;
}

.mCSB_scrollTools .mCSB_draggerContainer {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    height: auto;
}

.mCSB_scrollTools a+.mCSB_draggerContainer {
    margin: 20px 0;
}

.mCSB_scrollTools .mCSB_draggerRail {
    width: 2px;
    height: 100%;
    margin: 0 auto;
    -webkit-border-radius: 16px;
    -moz-border-radius: 16px;
    border-radius: 16px;
}

.mCSB_scrollTools .mCSB_dragger {
    cursor: pointer;
    width: 100%;
    height: 30px;
    z-index: 1;
}

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    position: relative;
    width: 4px;
    height: 100%;
    margin: 0 auto;
    -webkit-border-radius: 16px;
    -moz-border-radius: 16px;
    border-radius: 16px;
    text-align: center;
}

.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
    width: 12px;
}

.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
    width: 8px;
}

.mCSB_scrollTools .mCSB_buttonDown,
.mCSB_scrollTools .mCSB_buttonUp {
    display: block;
    position: absolute;
    height: 20px;
    width: 100%;
    overflow: hidden;
    margin: 0 auto;
    cursor: pointer;
}

.mCSB_scrollTools .mCSB_buttonDown {
    bottom: 0;
}

.mCSB_horizontal.mCSB_inside>.mCSB_container {
    margin-right: 0;
    margin-bottom: 30px;
}

.mCSB_horizontal.mCSB_outside>.mCSB_container {
    min-height: 100%;
}

.mCSB_horizontal>.mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden {
    margin-bottom: 0;
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal {
    width: auto;
    height: 16px;
    top: auto;
    right: 0;
    bottom: 0;
    left: 0;
}

.mCustomScrollBox+.mCSB_scrollTools+.mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox+.mCSB_scrollTools.mCSB_scrollTools_horizontal {
    bottom: -26px;
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal a+.mCSB_draggerContainer {
    margin: 0 20px;
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    width: 100%;
    height: 2px;
    margin: 7px 0;
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger {
    width: 30px;
    height: 100%;
    left: 0;
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    width: 100%;
    height: 4px;
    margin: 6px auto;
}

.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
    height: 12px;
    margin: 2px auto;
}

.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
    height: 8px;
    margin: 4px 0;
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft,
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight {
    display: block;
    position: absolute;
    width: 20px;
    height: 100%;
    overflow: hidden;
    margin: 0 auto;
    cursor: pointer;
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft {
    left: 0;
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight {
    right: 0;
}

.mCSB_container_wrapper {
    position: absolute;
    height: auto;
    width: auto;
    overflow: hidden;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin-right: 30px;
    margin-bottom: 30px;
}

.mCSB_container_wrapper>.mCSB_container {
    padding-right: 30px;
    padding-bottom: 30px;
}

.mCSB_vertical_horizontal>.mCSB_scrollTools.mCSB_scrollTools_vertical {
    bottom: 20px;
}

.mCSB_vertical_horizontal>.mCSB_scrollTools.mCSB_scrollTools_horizontal {
    right: 20px;
}

.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden+.mCSB_scrollTools.mCSB_scrollTools_vertical {
    bottom: 0;
}

.mCS-dir-rtl>.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden+.mCSB_scrollTools~.mCSB_scrollTools.mCSB_scrollTools_horizontal {
    right: 0;
}

.mCS-dir-rtl>.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_scrollTools.mCSB_scrollTools_horizontal {
    left: 20px;
}

.mCS-dir-rtl>.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden+.mCSB_scrollTools~.mCSB_scrollTools.mCSB_scrollTools_horizontal {
    left: 0;
}

.mCS-dir-rtl>.mCSB_inside>.mCSB_container_wrapper {
    margin-right: 0;
    margin-left: 30px;
}

.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden>.mCSB_container {
    padding-right: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden>.mCSB_container {
    padding-bottom: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden {
    margin-right: 0;
    margin-left: 0;
}

.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden {
    margin-bottom: 0;
}

.mCSB_scrollTools,
.mCSB_scrollTools .mCSB_buttonDown,
.mCSB_scrollTools .mCSB_buttonLeft,
.mCSB_scrollTools .mCSB_buttonRight,
.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    -webkit-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
    -moz-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
    -o-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
    transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
}

.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar {
    -webkit-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out;
    -moz-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out;
    -o-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out;
    transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out;
}

.mCSB_scrollTools {
    opacity: .75;
    filter: "alpha(opacity=75)";
    -ms-filter: "alpha(opacity=75)";
}

.mCS-autoHide>.mCustomScrollBox>.mCSB_scrollTools,
.mCS-autoHide>.mCustomScrollBox~.mCSB_scrollTools {
    opacity: 0;
    filter: "alpha(opacity=0)";
    -ms-filter: "alpha(opacity=0)";
}

.mCS-autoHide:hover>.mCustomScrollBox>.mCSB_scrollTools,
.mCS-autoHide:hover>.mCustomScrollBox~.mCSB_scrollTools,
.mCustomScrollBox:hover>.mCSB_scrollTools,
.mCustomScrollBox:hover~.mCSB_scrollTools,
.mCustomScrollbar>.mCustomScrollBox>.mCSB_scrollTools.mCSB_scrollTools_onDrag,
.mCustomScrollbar>.mCustomScrollBox~.mCSB_scrollTools.mCSB_scrollTools_onDrag {
    opacity: 1;
    filter: "alpha(opacity=100)";
    -ms-filter: "alpha(opacity=100)";
}

.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.4);
    filter: "alpha(opacity=40)";
    -ms-filter: "alpha(opacity=40)";
}

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.75);
    filter: "alpha(opacity=75)";
    -ms-filter: "alpha(opacity=75)";
}

.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.85);
    filter: "alpha(opacity=85)";
    -ms-filter: "alpha(opacity=85)";
}

.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.9);
    filter: "alpha(opacity=90)";
    -ms-filter: "alpha(opacity=90)";
}

.mCSB_scrollTools .mCSB_buttonDown,
.mCSB_scrollTools .mCSB_buttonLeft,
.mCSB_scrollTools .mCSB_buttonRight,
.mCSB_scrollTools .mCSB_buttonUp {
    background-image: url(mCSB_buttons.png);
    background-repeat: no-repeat;
    opacity: .4;
    filter: "alpha(opacity=40)";
    -ms-filter: "alpha(opacity=40)";
}

.mCSB_scrollTools .mCSB_buttonUp {
    background-position: 0 0;
}

.mCSB_scrollTools .mCSB_buttonDown {
    background-position: 0 -20px;
}

.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: 0 -40px;
}

.mCSB_scrollTools .mCSB_buttonRight {
    background-position: 0 -56px;
}

.mCSB_scrollTools .mCSB_buttonDown:hover,
.mCSB_scrollTools .mCSB_buttonLeft:hover,
.mCSB_scrollTools .mCSB_buttonRight:hover,
.mCSB_scrollTools .mCSB_buttonUp:hover {
    opacity: .75;
    filter: "alpha(opacity=75)";
    -ms-filter: "alpha(opacity=75)";
}

.mCSB_scrollTools .mCSB_buttonDown:active,
.mCSB_scrollTools .mCSB_buttonLeft:active,
.mCSB_scrollTools .mCSB_buttonRight:active,
.mCSB_scrollTools .mCSB_buttonUp:active {
    opacity: .9;
    filter: "alpha(opacity=90)";
    -ms-filter: "alpha(opacity=90)";
}

.mCS-dark.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.15);
}

.mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.75);
}

.mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: rgba(0, 0, 0, 0.85);
}

.mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: rgba(0, 0, 0, 0.9);
}

.mCS-dark.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -80px 0;
}

.mCS-dark.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -80px -20px;
}

.mCS-dark.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -80px -40px;
}

.mCS-dark.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -80px -56px;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-light-2.mCSB_scrollTools .mCSB_draggerRail {
    width: 4px;
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.1);
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 4px;
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.75);
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
}

.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    width: 100%;
    height: 4px;
    margin: 6px auto;
}

.mCS-light-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.85);
}

.mCS-light-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-light-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.9);
}

.mCS-light-2.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -32px 0;
}

.mCS-light-2.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -32px -20px;
}

.mCS-light-2.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -40px -40px;
}

.mCS-light-2.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -40px -56px;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.1);
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.75);
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.85);
}

.mCS-dark-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.9);
}

.mCS-dark-2.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -112px 0;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -112px -20px;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -120px -40px;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -120px -56px;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail,
.mCS-light-thick.mCSB_scrollTools .mCSB_draggerRail {
    width: 4px;
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.1);
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 6px;
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.75);
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}

.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    width: 100%;
    height: 4px;
    margin: 6px 0;
}

.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    width: 100%;
    height: 6px;
    margin: 5px auto;
}

.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.85);
}

.mCS-light-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.9);
}

.mCS-light-thick.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -16px 0;
}

.mCS-light-thick.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -16px -20px;
}

.mCS-light-thick.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -20px -40px;
}

.mCS-light-thick.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -20px -56px;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.1);
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.75);
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.85);
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.9);
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -96px 0;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -96px -20px;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -100px -40px;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -100px -56px;
}

.mCS-light-thin.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.1);
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 2px;
}

.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    width: 100%;
}

.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    width: 100%;
    height: 2px;
    margin: 7px auto;
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.15);
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.75);
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.85);
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.9);
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -80px 0;
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -80px -20px;
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -80px -40px;
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -80px -56px;
}

.mCS-rounded.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.15);
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded.mCSB_scrollTools .mCSB_dragger {
    height: 14px;
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 14px;
    margin: 0 1px;
}

.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger {
    width: 14px;
}

.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    height: 14px;
    margin: 1px 0;
}

.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
    width: 16px;
    height: 16px;
    margin: -1px 0;
}

.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
    width: 4px;
}

.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
    height: 16px;
    width: 16px;
    margin: 0 -1px;
}

.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
    height: 4px;
    margin: 6px 0;
}

.mCS-rounded.mCSB_scrollTools .mCSB_buttonUp {
    background-position: 0 -72px;
}

.mCS-rounded.mCSB_scrollTools .mCSB_buttonDown {
    background-position: 0 -92px;
}

.mCS-rounded.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: 0 -112px;
}

.mCS-rounded.mCSB_scrollTools .mCSB_buttonRight {
    background-position: 0 -128px;
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.75);
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.15);
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.85);
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.9);
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -80px -72px;
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -80px -92px;
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -80px -112px;
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -80px -128px;
}

.mCS-rounded-dots-dark.mCSB_scrollTools_vertical .mCSB_draggerRail,
.mCS-rounded-dots.mCSB_scrollTools_vertical .mCSB_draggerRail {
    width: 4px;
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    background-color: transparent;
    background-position: center;
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg==);
    background-repeat: repeat-y;
    opacity: .3;
    filter: "alpha(opacity=30)";
    -ms-filter: "alpha(opacity=30)";
}

.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    height: 4px;
    margin: 6px 0;
    background-repeat: repeat-x;
}

.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -16px -72px;
}

.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -16px -92px;
}

.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -20px -112px;
}

.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -20px -128px;
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYV2NkIAAYSVFgDFR8BqrBBEifBbGRTfiPZhpYjiQFBK3A6l6CvgAAE9kGCd1mvgEAAAAASUVORK5CYII=);
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -96px -72px;
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -96px -92px;
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -100px -112px;
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -100px -128px;
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-repeat: repeat-y;
    background-image: -moz-linear-gradient(left, rgba(255, 255, 255, 0.5) 0, rgba(255, 255, 255, 0) 100%);
    background-image: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255, 255, 255, 0.5)), color-stop(100%, rgba(255, 255, 255, 0)));
    background-image: -webkit-linear-gradient(left, rgba(255, 255, 255, 0.5) 0, rgba(255, 255, 255, 0) 100%);
    background-image: -o-linear-gradient(left, rgba(255, 255, 255, 0.5) 0, rgba(255, 255, 255, 0) 100%);
    background-image: -ms-linear-gradient(left, rgba(255, 255, 255, 0.5) 0, rgba(255, 255, 255, 0) 100%);
    background-image: linear-gradient(to right, rgba(255, 255, 255, 0.5) 0, rgba(255, 255, 255, 0) 100%);
}

.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    background-repeat: repeat-x;
    background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.5) 0, rgba(255, 255, 255, 0) 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.5)), color-stop(100%, rgba(255, 255, 255, 0)));
    background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.5) 0, rgba(255, 255, 255, 0) 100%);
    background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.5) 0, rgba(255, 255, 255, 0) 100%);
    background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.5) 0, rgba(255, 255, 255, 0) 100%);
    background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.5) 0, rgba(255, 255, 255, 0) 100%);
}

.mCS-3d-dark.mCSB_scrollTools_vertical .mCSB_dragger,
.mCS-3d.mCSB_scrollTools_vertical .mCSB_dragger {
    height: 70px;
}

.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger {
    width: 70px;
}

.mCS-3d-dark.mCSB_scrollTools,
.mCS-3d.mCSB_scrollTools {
    opacity: 1;
    filter: "alpha(opacity=30)";
    -ms-filter: "alpha(opacity=30)";
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_draggerRail {
    -webkit-border-radius: 16px;
    -moz-border-radius: 16px;
    border-radius: 16px;
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d.mCSB_scrollTools .mCSB_draggerRail {
    width: 8px;
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.2);
    box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.5), inset -1px 0 1px rgba(255, 255, 255, 0.2);
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #555;
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 8px;
}

.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    width: 100%;
    height: 8px;
    margin: 4px 0;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.5), inset 0 -1px 1px rgba(255, 255, 255, 0.2);
}

.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    width: 100%;
    height: 8px;
    margin: 4px auto;
}

.mCS-3d.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -32px -72px;
}

.mCS-3d.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -32px -92px;
}

.mCS-3d.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -40px -112px;
}

.mCS-3d.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -40px -128px;
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.1);
    box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1);
}

.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -112px -72px;
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -112px -92px;
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -120px -112px;
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -120px -128px;
}

.mCS-3d-thick-dark.mCSB_scrollTools,
.mCS-3d-thick.mCSB_scrollTools {
    opacity: 1;
    filter: "alpha(opacity=30)";
    -ms-filter: "alpha(opacity=30)";
}

.mCS-3d-thick-dark.mCSB_scrollTools,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer,
.mCS-3d-thick.mCSB_scrollTools,
.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer {
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    border-radius: 7px;
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.mCSB_inside+.mCS-3d-thick-dark.mCSB_scrollTools_vertical,
.mCSB_inside+.mCS-3d-thick.mCSB_scrollTools_vertical {
    right: 1px;
}

.mCS-3d-thick-dark.mCSB_scrollTools_vertical,
.mCS-3d-thick.mCSB_scrollTools_vertical {
    box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.5);
}

.mCS-3d-thick-dark.mCSB_scrollTools_horizontal,
.mCS-3d-thick.mCSB_scrollTools_horizontal {
    bottom: 1px;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.5);
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.4);
    width: 12px;
    margin: 2px;
    position: absolute;
    height: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4);
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #555;
}

.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    height: 12px;
    width: auto;
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.05);
    box-shadow: inset 1px 1px 16px rgba(0, 0, 0, 0.1);
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerRail {
    background-color: transparent;
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -32px -72px;
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -32px -92px;
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -40px -112px;
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -40px -128px;
}

.mCS-3d-thick-dark.mCSB_scrollTools {
    box-shadow: inset 0 0 14px rgba(0, 0, 0, 0.2);
}

.mCS-3d-thick-dark.mCSB_scrollTools_horizontal {
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.2);
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.4), inset -1px 0 0 rgba(0, 0, 0, 0.2);
}

.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), inset 0 -1px 0 rgba(0, 0, 0, 0.2);
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #777;
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer {
    background-color: #fff;
    background-color: rgba(0, 0, 0, 0.05);
    box-shadow: inset 1px 1px 16px rgba(0, 0, 0, 0.1);
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerRail {
    background-color: transparent;
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -112px -72px;
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -112px -92px;
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -120px -112px;
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -120px -128px;
}

.mCSB_outside+.mCS-minimal-dark.mCSB_scrollTools_vertical,
.mCSB_outside+.mCS-minimal.mCSB_scrollTools_vertical {
    right: 0;
    margin: 12px 0;
}

.mCustomScrollBox.mCS-minimal+.mCSB_scrollTools+.mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal+.mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal-dark+.mCSB_scrollTools+.mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal-dark+.mCSB_scrollTools.mCSB_scrollTools_horizontal {
    bottom: 0;
    margin: 0 12px;
}

.mCS-dir-rtl>.mCSB_outside+.mCS-minimal-dark.mCSB_scrollTools_vertical,
.mCS-dir-rtl>.mCSB_outside+.mCS-minimal.mCSB_scrollTools_vertical {
    left: 0;
    right: auto;
}

.mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-minimal.mCSB_scrollTools .mCSB_draggerRail {
    background-color: transparent;
}

.mCS-minimal-dark.mCSB_scrollTools_vertical .mCSB_dragger,
.mCS-minimal.mCSB_scrollTools_vertical .mCSB_dragger {
    height: 50px;
}

.mCS-minimal-dark.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-minimal.mCSB_scrollTools_horizontal .mCSB_dragger {
    width: 50px;
}

.mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.2);
    filter: "alpha(opacity=20)";
    -ms-filter: "alpha(opacity=20)";
}

.mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.5);
    filter: "alpha(opacity=50)";
    -ms-filter: "alpha(opacity=50)";
}

.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.2);
    filter: "alpha(opacity=20)";
    -ms-filter: "alpha(opacity=20)";
}

.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.5);
    filter: "alpha(opacity=50)";
    -ms-filter: "alpha(opacity=50)";
}

.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools .mCSB_draggerRail {
    width: 6px;
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.2);
}

.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 6px;
}

.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    width: 100%;
    height: 6px;
    margin: 5px 0;
}

.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
    width: 12px;
}

.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
    height: 12px;
    margin: 2px 0;
}

.mCS-light-3.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -32px -72px;
}

.mCS-light-3.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -32px -92px;
}

.mCS-light-3.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -40px -112px;
}

.mCS-light-3.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -40px -128px;
}

.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.75);
}

.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.85);
}

.mCS-dark-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.9);
}

.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.1);
}

.mCS-dark-3.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -112px -72px;
}

.mCS-dark-3.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -112px -92px;
}

.mCS-dark-3.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -120px -112px;
}

.mCS-dark-3.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -120px -128px;
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset.mCSB_scrollTools .mCSB_draggerRail {
    width: 12px;
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.2);
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 6px;
    margin: 3px 5px;
    position: absolute;
    height: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    height: 6px;
    margin: 5px 3px;
    position: absolute;
    width: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    width: 100%;
    height: 12px;
    margin: 2px 0;
}

.mCS-inset-2.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -32px -72px;
}

.mCS-inset-2.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -32px -92px;
}

.mCS-inset-2.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -40px -112px;
}

.mCS-inset-2.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -40px -128px;
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.75);
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.85);
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.9);
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.1);
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -112px -72px;
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -112px -92px;
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -120px -112px;
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -120px -128px;
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail {
    background-color: transparent;
    border-width: 1px;
    border-style: solid;
    border-color: #fff;
    border-color: rgba(255, 255, 255, 0.2);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail {
    border-color: #000;
    border-color: rgba(0, 0, 0, 0.2);
}

.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.6);
}

.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.6);
}

.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.75);
}

.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.85);
}

.mCS-inset-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.9);
}

.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.75);
}

.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.85);
}

.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.9);
}

img,
.menu span,
.header-right,
.header,
.header-code:before,
.header-code span,
.header-code p,
.header-lang,
.search,
.search form,
.search-close,
.header-right ul li.icon span:before,
.header-right ul li.icon span:after,
.header-search:before,
.header-search:after,
.subs,
.subs-item .em:before,
.subs-item p i a:before,
.subs-item p i a:after,
.navs,
.navs-li,
.navs-li:before,
.navs-li p,
.navs-li em:before,
.navs-li em:after,
.navs-form form,
.sub-nav,
.footer-1right ul li,
.footer-1right ul li img,
.menu-item:before,
.right-phone,
.right-wx,
.banner-detail span:before,
.banner-detail span:after,
.banner-more,
.habout-1more span,
.habout-1more span:before,
.habout-1more span:after,
.habout-item,
.habout-item samp img,
.habout-item span,
.happ-bg span,
.happ-more span,
.happ-more span:before,
.happ-more span:after,
.happ-item,
.happ-item:before,
.happ-item samp,
.happ-item span,
.hpro-right img,
.hpro-button .swiper-button-prev:before,
.hpro-button .swiper-button-prev:after,
.hpro-button .swiper-button-next:before,
.hpro-button .swiper-button-next:after,
.hpro-title span,
.hpro-nav p samp,
.hpro-nav p samp:before,
.hpro-nav p samp:after,
.hpro-nav span,
.hpro-nav em:before,
.hpro-nav em:after,
.hpro-bottom .swiper-button-prev,
.hpro-bottom .swiper-button-next,
.hnews-left,
.hnews-cont .h4,
.hnews-info,
.hnews-left em,
.hnews-left .swiper-pagination span,
.hnews-model,
.hnews-model:before,
.hnews-model span,
.hnews-model p,
.hnews-model em,
.bread-nav ul li a:before,
.news-input,
.news-right span,
.news-item:after,
.news-model span,
.detail-page span,
.vd-1 span,
.about-3item,
.about-3item:before,
.about-5 ul li,
.about-5pannel .swiper-button-prev,
.about-5pannel .swiper-button-next,
.join-item samp:before,
.join-center,
.contact-2item:before,
.contact-2cont,
.contact-3item,
.contact-3item span,
.contact-3item p,
.join-2right span,
.zx-nav span,
.zx-2item,
.zx-2left span,
.zx-2left em,
.zx-2left em:before,
.zx-2left em:after,
.zp-5,
.zp-5 input,
.solve-nav ul li,
.solve-nav ul li samp img,
.solve-2more em,
.solve-2more em:before,
.solve-2more em:after,
.solve-3content .swiper-slide,
.solve-3content .swiper-button-prev,
.solve-3content .swiper-button-next,
.solve-4right em,
.solve-5 ul li,
.solve-6 ul li,
.solve-6 ul li:before,
.solve-7pannel ul li,
.solve-7pannel ul li span,
.solve-7pannel ul li em,
.pro-title,
.pro-title span,
.pro-title span:before,
.pro-title em:before,
.pro-title em:after,
.pro-item span,
.pro-item em:before,
.pro-item em:after,
.pro-model ul li,
.pro-li p,
.pro-li p span,
.pro-1nav .swiper-slide,
.pro-1nav .swiper-button-prev,
.pro-1nav .swiper-button-next,
.pro-2 ul li,
.pro-2 ul li:before,
.pro-3pannel,
.pro-3small samp,
.pro-3small samp:before,
.pro-3small .pro-3res span,
.pro-3small .pro-3res em,
.pro-3rel span,
.pro-3rel .swiper-button-prev,
.pro-3rel .swiper-button-next,
.pro-3item samp em,
.pro-3video .swiper-button-prev,
.pro-3video .swiper-button-next,
.down-1icon,
.down-1icon samp img,
.down-1icon span,
.down-2content ul li,
.down-2content ul li span,
.down-2content ul li em,
.down-3content .swiper-slide,
.down-3item samp em,
.down-3item span,
.down-3content .swiper-button-prev,
.down-3content .swiper-button-next,
.down-4 select,
.down-4 .txt5,
.down-4 textarea,
.down-4bt input,
.tz-2 ul li,
.tz-2item,
.tz-2left:before,
.tz-2left span,
.tz-2left em,
.tz-2right span,
.tz-2right em,
.tz-3item,
.tz-3item samp img,
.tz-3item span,
.server-1left ul li,
.server-1bg span,
.server-1icon samp:before,
.server-1icon samp:after,
.server-1icon span,
.server-3 ul li,
.server-3 ul li span,
.server-3 ul li em,
.server-3more,
.server-4 ul li,
.server-4 ul li:after,
.server-4 ul li span,
.server-4item span,
.server-4more,
.pro-3li,
.pro-3li span,
.pro-3li em,
.zx-close,
.zx-g select,
.zx-g .txt5,
.zx-g textarea,
.zx-bt input {
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

/*分享*/
.weixin-prop {
    width: 300px;
    height: 380px;
    border: 1px #ddd solid;
    background: #fff;
    position: fixed;
    left: 50%;
    top: 50%;
    margin: -190px 0px 0px -150px;
    z-index: 2345667;
}

.weixin-close {
    width: 25px;
    height: 25px;
    position: absolute;
    right: 10px;
    top: 10px;
    line-height: 30px;
    text-align: center;
    font-size: 20px;
    color: #333;
    cursor: pointer;
}

.weixin-close:before {
    width: 60%;
    height: 2px;
    content: "";
    position: absolute;
    left: 20%;
    top: calc(50% - 1px);
    background: #333;
    transform: rotate(45deg);
}

.weixin-close:after {
    width: 60%;
    height: 2px;
    content: "";
    position: absolute;
    left: 20%;
    top: calc(50% - 1px);
    background: #333;
    transform: rotate(-45deg);
}

.weixin-img {
    float: left;
    width: 250px;
    margin: 60px 0px 0px 25px;
}

.weixin-img canvas {
    width: 250px;
    height: 250px;
}

.weixin-prop p {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 14px;
    text-align: center;
    color: #222;
}

/*swiper*/
.swiper-container {
    width: 100%;
    height: 100%;
}

.swiper-slide {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    height: auto;
}

.swiper-button-prev,
.swiper-button-next {
    background: none;
}

.swiper-button-prev::after,
.swiper-button-next::after {
    content: "";
}

.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.animated.hinge {
    -webkit-animation-duration: 3s;
    animation-duration: 3s;
}

@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translateY(40px);
        transform: translateY(40px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translateY(40px);
        -ms-transform: translateY(40px);
        transform: translateY(40px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
}

.fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
}

/*video*/
.video-prop {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: fixed;
    left: 0px;
    top: 0px;
    z-index: 1000;
    background: rgba(0, 0, 0, 0.6);
    text-align: center;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.video-prop:before {
    height: 100%;
    content: "";
    display: inline-block;
    vertical-align: middle;
}

.video-center {
    width: 65%;
    vertical-align: middle;
    display: inline-block;
    position: relative;
}

.video-center video {
    width: 100%;
    height: auto;
    display: block;
}

.video-close {
    width: 36px;
    height: 36px;
    overflow: hidden;
    position: absolute;
    right: -18px;
    top: -18px;
    z-index: 12;
    border-radius: 50%;
    background: #fafafa;
    text-align: center;
    cursor: pointer;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.video-close:before {
    width: 60%;
    height: 2px;
    content: "";
    position: absolute;
    left: 20%;
    top: calc(50% - 1px);
    background: #333;
    transform: rotate(45deg);
}

.video-close:after {
    width: 60%;
    height: 2px;
    content: "";
    position: absolute;
    left: 20%;
    top: calc(50% - 1px);
    background: #333;
    transform: rotate(-45deg);
}

.video-close:hover {
    transform: rotate(180deg);
}

.video-active {
    opacity: 1;
    visibility: visible;
}

@media screen and (max-width:768px) {
    .video-center {
        width: 90%;
    }

    .video-close {
        width: 32px;
        height: 32px;
        right: -16px;
        top: -16px;
    }
}

@keyframes opa {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes suofang {
    0% {
        transform: scale(1);
    }

    100% {
        transform: scale(1.2);
    }
}

@keyframes updown {
    0% {
        opacity: 0;
        transform: translateY(60px);
    }

    100% {
        opacity: 1;
        transform: translateY(0px);
    }
}

@keyframes quan1 {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@keyframes quan2 {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(-360deg);
    }
}

@keyframes wenhua {
    0% {
        opacity: 1;
    }

    2% {
        opacity: 0;
    }

    20% {
        opacity: 0;
    }

    30% {
        transform: translateY(60px);
        opacity: 0;
    }

    100% {
        transform: translateY(0px);
        opacity: 1;
    }
}

@keyframes cir1 {
    0% {
        transform: rotate(40deg);
        opacity: 0;
    }

    20% {
        transform: rotate(30deg);
        opacity: 1;
    }

    40% {
        transform: rotate(20deg);
        opacity: 1;
    }

    75% {
        transform: rotate(10deg);
        opacity: 0;
    }

    100% {
        transform: rotate(0deg);
        opacity: 0;
    }
}

@keyframes cir2 {
    0% {
        transform: rotate(3deg);
        opacity: 0;
    }

    20% {
        transform: rotate(1deg);
        opacity: 1;
    }

    40% {
        transform: rotate(-1deg);
        opacity: 1;
    }

    75% {
        transform: rotate(-3deg);
        opacity: 0;
    }

    100% {
        transform: rotate(-5deg);
        opacity: 0;
    }
}

@keyframes cir3 {
    0% {
        transform: rotate(-5deg);
        opacity: 0;
    }

    20% {
        transform: rotate(-3deg);
        opacity: 1;
    }

    40% {
        transform: rotate(-1deg);
        opacity: 1;
    }

    75% {
        transform: rotate(1deg);
        opacity: 0;
    }

    100% {
        transform: rotate(3deg);
        opacity: 0;
    }
}

@keyframes cir4 {
    0% {
        transform: scale(0.7);
        opacity: 1;
    }

    100% {
        transform: scale(1.07);
        opacity: 0;
    }
}

@keyframes ud {
    0% {
        transform: translateY(0px);
    }

    100% {
        transform: translateY(10px);
    }
}

.content {
    width: 100%;
    overflow: hidden;
}

/*header*/
.header {
    width: 100%;
    height: 100px;
    position: fixed;
    left: 0px;
    top: 0px;
    z-index: 1000;
    padding: 0px 50px;
    box-sizing: border-box;
}

.header .logo {
    float: left;
    width: 190px;
    height: 100%;
    overflow: hidden;
    position: relative;
}

.header .logo a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
}

.header .logo img {
    width: 100%;
    height: auto;
    position: absolute;
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
}

.header .logo img:last-child {
    opacity: 0;
}

.header-code {
    display: none;
    float: left;
    width: auto;
    overflow: hidden;
    color: #fff;
    margin: 30px 0px 0px 20px;
    padding-left: 20px;
    position: relative;
}

.header-code:before {
    width: 1px;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: rgba(255, 255, 255, 0.2);
}

.header-code span {
    width: 100%;
    overflow: hidden;
    display: block;
    font-size: 16px;
    letter-spacing: 3px;
}

.header-code p {
    width: 100%;
    overflow: hidden;
    display: block;
    font-size: 18px;
}

.header-lang {
    float: left;
    width: 68px;
    height: 20px;
    box-sizing: border-box;
    margin-left: 30px;
    overflow: hidden;
    margin-top: calc((100px - 18px)/2);
}

.header-lang span {
    float: left;
    width: 50%;
    height: 100%;
    text-align: center;
    line-height: 17px;
}

.header-lang span a {
    color: #fff;
    font-size: 14px;
    font-family: "arial";
}

.header-lang span.active {
    background: #c62630;
}

.header-lang span.active a {
    color: #fff;
}

.header-right {
    float: right;
    width: auto;
    height: 100%;
}

.search {
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0px;
    top: 0px;
    background: rgba(0, 0, 0, 0.6);
    z-index: 500;
    opacity: 0;
    visibility: hidden;
}

.search form {
    width: 80%;
    height: 60px;
    line-height: 60px;
    margin: 100px auto 0px;
    background: #fff;
    position: relative;
    transform: translateY(-100px);
}

.search form .txt {
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: block;
    box-sizing: border-box;
    padding: 0px 20px 0px 60px;
}

.search form .bt {
    width: 50px;
    height: 100%;
    overflow: hidden;
    display: block;
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../images/icon-2-2.png") no-repeat center;
    cursor: pointer;
}

.search-close {
    width: 60px;
    height: 100%;
    position: absolute;
    right: 0px;
    top: 0px;
    cursor: pointer;
    background: url("../images/close.png") no-repeat center;
}

.search-close:hover {
    transform: rotate(180deg);
}

.search.search-active {
    opacity: 1;
    visibility: visible;
}

.search.search-active form {
    transform: translateY(0px);
}

.header-right ul {
    float: left;
    width: auto;
    height: 100%;
}

.header-right ul li {
    float: left;
    width: auto;
    height: 100%;
    margin-left: 4.42vw;
    position: relative;
}

.header-right ul li:nth-child(2) {
    position: static;
}

.header-right ul li span {
    float: left;
    width: auto;
    line-height: 100px;
    position: relative;
}

.header-right ul li.icon span:before {
    width: 8px;
    height: 100px;
    content: "";
    position: absolute;
    right: 0px;
    top: 0px;
    background: url("../images/icon-1.png") no-repeat right center;
}

.header-right ul li.icon span:after {
    width: 8px;
    height: 100px;
    content: "";
    position: absolute;
    right: 0px;
    top: 0px;
    background: url("../images/icon-1-1.png") no-repeat right center;
    opacity: 0;
}

.header-right ul li span a {
    font-size: 16px;
    color: #fff;
}

.header-right ul li.icon span {
    padding-right: 18px;
}

.header-right ul li.icon.on span:before,
.header-right ul li.icon:hover span:before {
    opacity: 0;
}

.header-right ul li.icon.on span:after,
.header-right ul li.icon:hover span:after {
    opacity: 1;
}

.header-search {
    float: left;
    width: 18px;
    height: 22px;
    overflow: hidden;
    cursor: pointer;
    margin-left: 30px;
    border-left: 1px rgba(255, 255, 255, 0.2) solid;
    padding-left: 32px;
    position: relative;
    margin-top: calc((100px - 22px)/2);
}

.header-search:before {
    width: 18px;
    height: 100%;
    content: "";
    position: absolute;
    right: 0px;
    top: 0px;
    background: url("../images/icon-2.png") no-repeat center;
}

.header-search:after {
    width: 18px;
    height: 100%;
    content: "";
    position: absolute;
    right: 0px;
    top: 0px;
    background: url("../images/icon-2-1.png") no-repeat center;
    opacity: 0;
}

.subs {
    width: 100%;
    overflow: hidden;
    background: #fff;
    box-shadow: 0px 4px 12px 5px rgba(0, 0, 0, 0.02);
    position: absolute;
    left: 0px;
    top: 100px;
    z-index: 123;
    border-top: 1px #ddd solid;
    padding-bottom: 20px;
    opacity: 0;
    visibility: hidden;
    transform: scale(0);
    transform-origin: top;
}

.subs-center {
    width: 88.02%;
    overflow: hidden;
    margin: 20px auto 0px;
    display: flex;
    justify-content: center;
}

.subs-item {
    width: auto;
    overflow: hidden;
    position: relative;
    padding: 0px 5vw;
}

.subs-item:before {
    width: 1px;
    height: 200px;
    content: "";
    position: absolute;
    right: 0px;
    top: 0px;
    background: #ebebeb;
}

.subs-item:first-child {
    padding-left: 0px;
}

.subs-item:last-child {
    padding-right: 0px;
}

.subs-item:last-child:before {
    display: none;
}

.subs-item .em {
    width: 100%;
    display: block;
    overflow: hidden;
    font-size: 14px;
    color: #c62630;
    white-space: pre;
    position: relative;
}

.subs-item .em a {
    float: left;
    width: auto;
    color: #006ab7;
    font-weight: bold;
}

.subs-item .em a:hover {
    transform: translateX(5px);
}

.subs-item p {
    width: 100%;
    overflow: hidden;
    margin-top: 10px;
}

.subs-item p i {
    width: 100%;
    display: block;
    overflow: hidden;
    line-height: 30px;
    font-style: normal;
}

.subs-item p i a {
    float: left;
    width: auto;
    overflow: hidden;
    font-size: 12px;
    color: #333;
    position: relative;
    padding-right: 12px;
}

.subs-item p i a:before {
    width: 7px;
    height: 7px;
    content: "";
    position: absolute;
    right: 0px;
    top: 12px;
    background: url("../images/icon-1-2.png") no-repeat center;
    background-size: 100%;
    transform: rotate(-90deg);
    opacity: 1;
}

.subs-item p i a:after {
    width: 7px;
    height: 7px;
    content: "";
    position: absolute;
    right: 0px;
    top: 12px;
    background: url("../images/icon-1-1.png") no-repeat center;
    background-size: 100%;
    transform: rotate(-90deg);
    opacity: 0;
}

.subs-item p i:hover a {
    color: #006ab7;
}

.subs-item p i:hover a:before {
    opacity: 0;
}

.subs-item p i:hover a:after {
    opacity: 1;
}

.header-right ul li.active .subs {
    opacity: 1;
    visibility: visible;
    transform: scale(1);
}

.navs {
    width: 80%;
    position: absolute;
    left: 10%;
    top: 100px;
    background: #fff;
    z-index: 123;
    height: 640px;
    box-shadow: 0px 4px 12px 5px rgba(0, 0, 0, 0.02);
    opacity: 0;
    visibility: hidden;
    transform: scale(0);
    transform-origin: top;
}

.navs-left {
    float: left;
    width: 450px;
    overflow: hidden;
    height: 100%;
    background: url("../images/bg-5.jpg") no-repeat;
    background-size: cover;
}

.navs-ul {
    width: 80%;
    overflow: hidden;
    margin: 30px auto 0px;
}

.navs-li {
    float: left;
    width: 100%;
    overflow: hidden;
    height: 60px;
    line-height: 60px;
    margin-top: 30px;
    cursor: pointer;
}

.navs-li a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.navs-li p {
    float: left;
    width: auto;
    height: 100%;
    font-size: 18px;
    color: #fff;
    margin-left: 20px;
}

.navs-li em {
    float: right;
    width: 40px;
    height: 40px;
    overflow: hidden;
    position: relative;
}

.navs-li em:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    right: 0px;
    top: 0px;
    background: url("../images/icon-5.png") no-repeat center;
    opacity: 1;
}

.navs-li em:after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    right: 0px;
    top: 0px;
    background: url("../images/icon-5-2.png") no-repeat center;
    opacity: 0;
}

.navs-li.active {
    background: #fff;
}

.navs-li.active p {
    color: #333;
}

.navs-li.active em:before {
    opacity: 0;
}

.navs-li.active em:after {
    opacity: 1;
}

.navs-right {
    float: right;
    width: calc(100% - 450px);
    overflow: hidden;
}

.navs-form {
    width: 86%;
    overflow: hidden;
    margin: 60px auto 0px;
}

.navs-form form {
    float: left;
    width: 40%;
    overflow: hidden;
    border: 1px #ddd solid;
    height: 50px;
    line-height: 50px;
    position: relative;
}

.navs-form .txt6 {
    float: left;
    width: 100%;
    height: 100%;
    overflow: hidden;
    padding: 0px 60px 0px 20px;
    box-sizing: border-box;
    font-size: 14px;
    outline-color: #666;
}

.navs-form .bt6 {
    width: 50px;
    height: 50px;
    overflow: hidden;
    position: absolute;
    right: 0px;
    top: 0px;
    z-index: 12;
    background: url("../images/icon-2-2.png") no-repeat center;
    cursor: pointer;
}

.navs-form form:hover {
    border-color: #2057c7;
}

.navs-form p {
    float: left;
    width: auto;
    line-height: 50px;
}

.navs-form p a {
    float: left;
    width: auto;
    height: 30px;
    line-height: 30px;
    overflow: hidden;
    margin: 10px 0px 0px 30px;
    padding: 0px 15px;
    border-radius: 15px;
    font-family: 14px;
    color: #fff;
    background: #2057c7;
}

.navs-form p a:hover {
    transform: translateX(5px);
}

.navs-model {
    width: 86%;
    overflow: hidden;
    margin: 10px auto 0px;
    height: 500px;
    position: relative;
}

.navs-pannel {
    width: 100%;
    height: 100%;
    overflow-y: auto;
    display: none;
    box-sizing: border-box;
    overflow-x: hidden;
}

.navs-pannel.active {
    display: block;
}

.navs-pannel h4 {
    float: left;
    width: 100%;
    overflow: hidden;
    border-bottom: 1px #eee solid;
    font-size: 18px;
    color: #333;
    padding-left: 25px;
    position: relative;
    padding-bottom: 10px;
    margin-top: 40px;
}

.navs-pannel h4:before {
    width: 8px;
    height: 8px;
    content: "";
    position: absolute;
    left: 0px;
    top: 8px;
    border-radius: 50%;
    background: #2057c7;
}

.navs-list {
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    padding: 0px 25px;
}

.nav-item {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 16px;
    color: #666;
    line-height: 24px;
    margin-top: 10px;
}

.nav-item a {
    color: #666;
}

.nav-item a:hover {
    color: #2057c7;
}

.header-right ul li.active .navs {
    opacity: 1;
    visibility: visible;
    transform: scale(1);
}

.sub-nav {
    width: auto;
    background: #fff;
    position: absolute;
    left: 50%;
    top: 100px;
    padding: 10px 0px;
    min-width: 150px;
    opacity: 0;
    visibility: hidden;
    transform: translateX(-50%) scale(0);
    transform-origin: top;
    border-radius: 0px 0px 4px 4px;
    box-shadow: 0px 4px 12px 5px rgba(0, 0, 0, 0.02);
}

.sub-nav p {
    width: 100%;
    overflow: hidden;
    line-height: 36px;
}

.sub-nav p a {
    font-size: 13px;
    color: #222;
    word-break: keep-all;
    text-align: center;
    width: 100%;
    display: block;
    padding: 0px 15px;
    box-sizing: border-box;
}

.sub-nav p a:hover {
    background: #006ab7;
    color: #fff;
}

.header-right ul li.active .sub-nav {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) scale(1);
}

.header-active,
.header-on {
    background: #fff;
    box-shadow: 0px 0px 12px 4px rgba(0, 0, 0, 0.02);
}

.header-active .logo img,
.header-on .logo img {
    opacity: 0;
}

.header-active .logo img:last-child,
.header-on .logo img:last-child {
    opacity: 1;
}

.header-active .header-code:before,
.header-on .header-code:before {
    background: #e5e5e5;
}

.header-active .header-code span,
.header-on .header-code span {
    color: #999;
}

.header-active .header-code p,
.header-on .header-code p {
    color: #222;
}

.header-active .header-lang,
.header-on .header-lang {
    border-color: #006ab7;
}

.header-active .header-lang span a,
.header-on .header-lang span a {
    color: #666;
}

.header-active .header-lang span.active a,
.header-on .header-lang span.active a {
    color: #fff;
}

.header-active .header-right ul li span a,
.header-on .header-right ul li span a {
    color: #666;
}

.header-active .header-right ul li.icon span:before,
.header-on .header-right ul li.icon span:before {
    background-image: url("../images/icon-1-2.png");
}

.header-active .header-search,
.header-on .header-search {
    border-left-color: #ccc;
}

.header-active .header-search:before,
.header-on .header-search:before {
    opacity: 0;
}

.header-active .header-search:after,
.header-on .header-search:after {
    opacity: 1;
}

/*footer*/
.footer {
    width: 100%;
    background: #1a1a1a;
    color: #fff;
    overflow: hidden;
    padding: 0px 60px;
    box-sizing: border-box;
}

.footer-1 {
    width: 100%;
    margin: 100px auto 0px;
    overflow: hidden;
    border-bottom: 1px rgba(255, 255, 255, 0.1) solid;
    padding-bottom: 30px;
}

.footer-1left {
    float: left;
    width: auto;
    overflow: hidden;
}

.footer-1left span {
    width: 100%;
    overflow: hidden;
    display: block;
    font-size: 24px;
    opacity: 0.5;
}

.footer-1left em {
    width: 100%;
    overflow: hidden;
    display: block;
    font-size: 52px;
    font-family: "dinbold";
    margin-top: 10px;
}

.footer-1left ul {
    width: 100%;
    overflow: hidden;
    margin-top: 12px;
}

.footer-1left ul li {
    width: 100%;
    overflow: hidden;
    font-size: 14px;
    opacity: 0.5;
    line-height: 24px;
}

.footer-1left ul li a {
    color: #fff;
}

.footer-1right {
    float: right;
    width: auto;
    overflow: hidden;
    margin-top: 20px;
}

.footer-1right span {
    width: 100%;
    overflow: hidden;
    display: block;
    font-size: 24px;
    opacity: 0.5;
}

.footer-1right ul {
    width: 100%;
    overflow: hidden;
    margin-top: 40px;
}

.footer-1right ul li {
    float: left;
    width: 48px;
    height: 48px;
    overflow: hidden;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.05);
    margin-right: 20px;
    position: relative;
    cursor: pointer;
}

.footer-1right ul li img {
    width: auto;
    height: auto;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    opacity: 0.5;
}

.footer-1right ul li:hover {
    background: #d70a17;
}

.footer-1right ul li:hover img {
    opacity: 1;
}

.footer-1right ul li:last-child {
    margin-right: 0px;
}

.footer-2 {
    width: 100%;
    margin: 0px auto 0px;
    overflow: hidden;
    border-bottom: 1px rgba(255, 255, 255, 0.1) solid;
    padding-bottom: 50px;
    padding-top: 40px;
}

.footer-2item {
    float: left;
    width: auto;
    overflow: hidden;
    margin-right: 5vw;
}

.footer-2item .h3 {
    width: 100%;
    overflow: hidden;
    font-size: 18px;
    color: rgba(255, 255, 255, 0.5);
    position: relative;
    padding-bottom: 20px;
}

.footer-2item .h3:before {
    width: 14px;
    height: 2px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: #006ab7;
}

.footer-2item .h3 a {
    color: rgba(255, 255, 255, 0.5);
}

.footer-2item ul {
    width: 100%;
    overflow: hidden;
    margin-top: 10px;
}

.footer-2item ul li {
    width: 100%;
    overflow: hidden;
    line-height: 36px;
}

.footer-2item ul li a {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.5);
}

.footer-2item ul li a:hover {
    color: #d70a17;
}

.footer-2pannel {
    width: 100%;
    overflow: hidden;
}

.footer-2pannel ul {
    float: left;
    width: auto;
}

.footer-2pannel ul:first-child {
    margin-right: 20px;
}

.footer-2right {
    float: right;
    width: auto;
    margin-left: 20px;
    overflow: hidden;
}

.footer-2right samp {
    width: 180px;
    display: block;
    overflow: hidden;
}

.footer-2right samp img {
    width: 100%;
    height: auto;
}

.footer-2right span {
    width: 100%;
    display: block;
    overflow: hidden;
    text-align: center;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.5);
    line-height: 20px;
    margin-top: 24px;
}

.footer-3 {
    width: 100%;
    margin: 0px auto 0px;
    overflow: hidden;
    padding: 50px 0px 60px;
}

.footer-3 ul {
    float: left;
    width: auto;
    overflow: hidden;
}

.footer-3 ul li {
    float: left;
    width: auto;
    margin-right: 40px;
}

.footer-3 ul li a {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.5);
}

.footer-3 ul li a:hover {
    color: #d70a17;
}

.footer-3 p {
    float: right;
    width: auto;
    overflow: hidden;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.5);
}

.footer-3 p span {
    margin-left: 10px;
}

.footer-3 p a {
    color: rgba(255, 255, 255, 0.5);
}

.footer-3 p a:hover {
    color: #d70a17;
}

.section .footer-1,
.section .footer-2,
.section .footer-3 {
    opacity: 0;
    transform: translateY(60px);
}

.section.active .footer-1 {
    animation: updown 0.6s ease 0.6s 1;
    animation-fill-mode: forwards;
}

.section.active .footer-2 {
    animation: updown 0.6s ease 0.65s 1;
    animation-fill-mode: forwards;
}

.section.active .footer-3 {
    animation: updown 0.6s ease 0.7s 1;
    animation-fill-mode: forwards;
}

.footer-form {
    float: left;
    width: 20%;
    margin-left: 5vw;
}

.footer-form span {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 24px;
    color: #fff;
    opacity: 0.5;
}

.footer-form form {
    float: left;
    width: 100%;
    overflow: hidden;
    position: relative;
    height: 40px;
    line-height: 40px;
    border: 1px #fff solid;
    border-radius: 4px;
    margin-top: 20px;
    background: white;
}

.footer-form .txt {
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: none;
    box-sizing: border-box;
    padding: 0px 14px;
}

.footer-form .bt {
    width: 40px;
    height: 100%;
    position: absolute;
    right: 0px;
    top: 0px;
    background: url("../images/icon-2-1.png") no-repeat center;
    z-index: 12;
    cursor: pointer;
}

.footer-form p {
    float: left;
    width: 100%;
    font-size: 14px;
    line-height: 24px;
    color: #fff;
    opacity: 0.5;
    margin-top: 10px;
}

/*right-nav*/
@keyframes dash {
    to {
        stroke-dashoffset: 0px;
    }
}

.menu-pos {
    width: auto;
    position: fixed;
    right: 60px;
    top: 55%;
    transform: translateY(-50%);
    z-index: 1000;
}

.menu-item {
    width: 18px;
    height: 18px;
    margin: 10px 0px;
    position: relative;
}

.menu-item:before {
    width: 6px;
    height: 6px;
    position: absolute;
    content: "";
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 50%;
}

.menu-item.active:before {
    background: #006ab7;
}

.menu-item .circle {
    stroke-dasharray: 360px;
    stroke-dashoffset: 360px;
}

.menu-item .load {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    left: 0px;
    top: 0px;
}

.menu-item.active .circle {
    animation: dash 2s linear forwards;
    stroke: #006ab7;
}

/*
.menu-item.active5:before {
    background: #006ab7 !important;
}

.menu-item.active5 .circle {
    stroke: #006ab7 !important;
}
*/

/*right-float*/
.right-float {
    width: 70px;
    position: fixed;
    right: 2px;
    bottom: 4%;
    z-index: 300;
}

.right-1 {
    width: 70px;
    height: 70px;
    background: #006ab7;
    border-radius: 6px;
    margin-top: 1px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-content: center;
    position: relative;
    cursor: pointer;
}

.right-1 a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-content: center;
}

.right-1 samp {
    width: 100%;
    overflow: hidden;
    display: block;
    text-align: center;
}

.right-1 span {
    width: 100%;
    display: block;
    overflow: hidden;
    text-align: center;
    font-size: 12px;
    color: #fff;
    margin-top: 6px;
}

.right-phone {
    width: 190px;
    height: 70px;
    position: absolute;
    right: 90px;
    top: 50%;
    background: #fff;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-content: center;
    border-radius: 6px;
    box-sizing: border-box;
    padding-left: 16px;
    opacity: 0;
    transform-origin: right center;
    transform: translateY(-50%) scale(0);
}

.right-phone:before {
    width: auto;
    content: "";
    position: absolute;
    right: -10px;
    top: 50%;
    transform: translateY(-50%);
    border-left: 10px #fff solid;
    border-top: 10px transparent solid;
    border-bottom: 10px transparent solid;
}

.right-phone p {
    width: 100%;
    overflow: hidden;
    font-size: 16px;
    color: #222;
    line-height: 24px;
}

.right-1:hover .right-phone {
    transform: translateY(-50%) scale(1);
    opacity: 1;
}

.right-wx {
    width: 180px;
    height: 180px;
    position: absolute;
    right: 90px;
    top: 50%;
    background: #fff;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-content: center;
    border-radius: 6px;
    box-sizing: border-box;
    transform-origin: right center;
    transform: translateY(-50%) scale(0);
}

.right-wx:before {
    width: auto;
    content: "";
    position: absolute;
    right: -10px;
    top: 50%;
    transform: translateY(-50%);
    border-left: 10px #fff solid;
    border-top: 10px transparent solid;
    border-bottom: 10px transparent solid;
}

.right-wx img {
    width: 100%;
    height: auto;
    border-radius: 6px;
}

.right-1:hover .right-wx {
    transform: translateY(-50%) scale(1);
    opacity: 1;
}

.right-2 {
    width: 70px;
    height: 70px;
    background: #fff;
    border-radius: 6px;
    margin-top: 1px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-content: center;
    position: relative;
    cursor: pointer;
    box-shadow: 0px 0px 12px 4px rgba(0, 0, 0, 0.04);
}

.right-2 span {
    width: 100%;
    overflow: hidden;
    text-align: center;
    display: block;
    font-size: 14px;
    font-weight: bold;
    color: #006ab7;
    background: url("../images/icon-153.png") no-repeat top center;
    padding-top: 12px;
}

.right-2 p {
    width: 100%;
    overflow: hidden;
    text-align: center;
    display: block;
    font-size: 12px;
    color: #222;
}

/*home-banner*/
.banner {
    width: 100%;
    height: 100vh;
    overflow: hidden;
    position: relative;
}

.banner img {
    width: 100%;
    display: block;
    height: 100%;
    object-fit: cover;
}

.banner-ver {
    width: 100%;
    position: absolute;
    left: 0px;
    top: 35%;
    color: #fff;
}

.banner-ver .h3 {
    width: 100%;
    text-align: center;
    font-size: 52px;
    text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.4);
    font-weight: bold;
    letter-spacing: 2px;
    line-height: 78px;
    overflow: hidden;
    opacity: 0;
    transform: translateY(60px);
}

.banner-ver p {
    width: 100%;
    text-align: center;
    font-size: 20px;
    text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.4);
    line-height: 30px;
    margin-top: 20px;
    overflow: hidden;
    opacity: 0;
    transform: translateY(60px);
}

.banner-ver span {
    width: 100%;
    display: block;
    overflow: hidden;
    text-align: center;
    font-size: 28px;
    font-weight: bold;
    margin-top: 56px;
    opacity: 0;
    transform: translateY(60px);
}

.banner-ver span em {
    color: #ff0010;
    font-weight: bold;
}

.banner-other {
    width: 88.02%;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 150px;
    z-index: 12;
    box-sizing: border-box;
}

.banner-other .swiper-button-prev {
    width: 52px;
    height: 52px;
    overflow: hidden;
    background: url("../images/icon-4.png") no-repeat center;
    left: auto;
    right: 250px;
}

.banner-other .swiper-button-prev:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    border-radius: 50%;
    border: 1px rgba(255, 255, 255, 0.5) solid;
    box-sizing: border-box;
}

.banner-other .swiper-button-next {
    width: 52px;
    height: 52px;
    overflow: hidden;
    background: url("../images/icon-4.png") no-repeat center;
    transform: rotate(180deg);
    right: 180px;
}

.banner-other .swiper-button-next:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    border-radius: 50%;
    border: 1px rgba(255, 255, 255, 0.5) solid;
    box-sizing: border-box;
}

.banner-other .swiper-pagination {
    color: #fff;
    font-size: 18px;
    font-family: "dinreg";
    width: auto;
    left: auto;
    right: 100px;
    top: 10px;
}

.banner .swiper-slide-active .banner-ver .h3 {
    animation: updown 0.6s ease 0.5s 1;
    animation-fill-mode: forwards;
}

.banner .swiper-slide-active .banner-ver p {
    animation: updown 0.6s ease 0.55s 1;
    animation-fill-mode: forwards;
}

.banner .swiper-slide-active .banner-ver span {
    animation: updown 0.6s ease 0.6s 1;
    animation-fill-mode: forwards;
}

.banner-other .swiper-button-prev .circle {
    stroke-dasharray: 360px;
    stroke-dashoffset: 360px;
    box-sizing: border-box;
}

.banner-other .swiper-button-prev .load {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    left: 0px;
    top: 0px;
}

.banner-other .swiper-button-prev:hover .circle {
    animation: dash 1s linear forwards;
    stroke: #006ab7;
}

.banner-other .swiper-button-next .circle {
    stroke-dasharray: 360px;
    stroke-dashoffset: 360px;
    box-sizing: border-box;
}

.banner-other .swiper-button-next .load {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    left: 0px;
    top: 0px;
}

.banner-other .swiper-button-next:hover .circle {
    animation: dash 1s linear forwards;
    stroke: #006ab7;
}

.banner-wz {
    width: 80%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 213;
}

.banner-wz .h3 {
    float: left;
    width: auto;
    overflow: hidden;
    font-size: 56px;
    line-height: 68px;
    background-image: -webkit-linear-gradient(left, #be1c26 45%, #475bd5);
    background-image: -moz-linear-gradient(left, #be1c26 45%, #475bd5);
    background-image: -ms-linear-gradient(left, #be1c26 45%, #475bd5);
    background-image: -o-linear-gradient(left, #be1c26 45%, #475bd5);
    background-image: linear-gradient(left, #be1c26 45%, #475bd5);
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -ms-background-clip: text;
    -o-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    -moz-text-fill-color: transparent;
    -ms-text-fill-color: transparent;
    -o-text-fill-color: transparent;
    text-fill-color: transparent;
    font-weight: bold;
    opacity: 0;
    transform: translateY(60px);
}

.banner-wz1 {
    float: left;
    width: 100%;
    overflow: hidden;
    margin-top: 30px;
    opacity: 0;
    transform: translateY(60px);
}

.banner-wz1 span {
    float: left;
    width: 100%;
    overflow: hidden;
    line-height: 48px;
    font-size: 34px;
    color: #333;
    font-family: "symed";
}

.banner-wz1 p {
    float: left;
    width: 100%;
    overflow: hidden;
    line-height: 48px;
    font-size: 34px;
    color: #333;
    font-family: "symed";
}

.banner-wz ul {
    float: left;
    width: 100%;
    overflow: hidden;
    margin-top: 30px;
    opacity: 0;
    transform: translateY(60px);
}

.banner-wz ul li {
    float: left;
    width: auto;
    overflow: hidden;
    margin-right: 3vw;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.banner-wz ul li samp {
    width: auto;
    display: block;
    margin-right: 16px;
}

.banner-wz ul li samp img {
    width: auto;
    height: auto;
}

.banner-right {
    width: auto;
    overflow: hidden;
    line-height: 22px;
    font-size: 16px;
    color: #222;
}

.banner-detail {
    float: left;
    width: 100%;
    margin-top: 6vw;
    opacity: 0;
    transform: translateY(60px);
}

.banner-detail a {
    float: left;
    width: 170px;
    height: 56px;
    line-height: 56px;
    overflow: hidden;
    border: 2px #b91d2d solid;
    border-radius: 2px;
    text-align: center;
}

.banner-detail span {
    width: 70%;
    display: block;
    margin: 0px auto;
    font-size: 16px;
    color: #b91d2d;
    position: relative;
}

.banner-detail span:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../images/icon-132-1.png") no-repeat right center;
    opacity: 1;
}

.banner-detail span:after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../images/icon-132.png") no-repeat right center;
    opacity: 0;
}

.banner-detail a:hover {
    background: #b91d2d;
}

.banner-detail a:hover span {
    color: #fff;
}

.banner-detail a:hover span:before {
    opacity: 0;
}

.banner-detail a:hover span:after {
    opacity: 1;
}

.banner .swiper-slide-active .banner-wz .h3 {
    animation: updown 0.6s ease 0.5s 1;
    animation-fill-mode: forwards;
}

.banner .swiper-slide-active .banner-wz1 {
    animation: updown 0.6s ease 0.55s 1;
    animation-fill-mode: forwards;
}

.banner .swiper-slide-active .banner-wz ul {
    animation: updown 0.6s ease 0.6s 1;
    animation-fill-mode: forwards;
}

.banner .swiper-slide-active .banner-detail {
    animation: updown 0.6s ease 0.65s 1;
    animation-fill-mode: forwards;
}

.banner-new {
    width: calc(88.02% - 100px);
    position: absolute;
    left: calc((100% - 88.02%)/2);
    bottom: 42px;
    z-index: 12;
    height: 40px;
    line-height: 40px;
    background: #fff;
    overflow: hidden;
    border-radius: 2px;
    opacity: 0;
    transform: translateY(60px);
}

.banner-title {
    float: left;
    width: 170px;
    height: 100%;
    overflow: hidden;
    background: #005799;
    text-align: center;
}

.banner-title span {
    width: auto;
    display: inline-block;
    height: 100%;
    background: url("../images/icon-3.png") no-repeat left center;
    padding-left: 18px;
    font-size: 14px;
    color: #fff;
}

.banner-cont {
    float: left;
    width: calc(100% - 300px);
    overflow: hidden;
    height: 100%;
    padding-left: 24px;
    box-sizing: border-box;
}

.banner-cont ul,
.banner-cont ul li {
    float: left;
    width: auto;
    overflow: hidden;
    height: 100%;
}

.banner-cont ul li {
    margin-left: 50px;
    padding-left: 15px;
    position: relative;
}

.banner-cont ul li:before {
    width: 3px;
    height: 3px;
    content: "";
    position: absolute;
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    background: #999;
    border-radius: 50%;
}

.banner-cont ul li a {
    font-size: 14px;
    color: #666;
}

.banner-cont ul li span {
    color: #999;
    margin-right: 20px;
}

.banner-cont ul li a:hover {
    color: #006ab7;
}

.banner-more {
    float: right;
    width: auto;
    height: 100%;
    margin-right: 20px;
}

.banner-more a {
    font-size: 12px;
    color: #006ab7;
}

.banner-more:hover {
    transform: translateX(5px);
}

.banner-new {
    animation: updown 0.6s ease 0.65s 1;
    animation-fill-mode: forwards;
}

/*home-about*/
.habout {
    width: 100%;
    height: 100vh;
    overflow: hidden;
    position: relative;
}

.habout-bg {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.habout-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    animation: suofang 60s linear infinite alternate;
}

.habout-1 {
    width: 88.02%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    top: 50%;
    position: absolute;
    z-index: 12;
    color: #fff;
    margin-top: -40px;
}

.habout-1 .h3 {
    float: left;
    width: 54%;
    overflow: hidden;
    font-size: 46px;
    opacity: 0;
    transform: translateY(60px);
}

.habout-1info {
    float: left;
    width: 54%;
    overflow: hidden;
    font-size: 24px;
    line-height: 36px;
    margin-top: 22px;
    position: relative;
    padding-bottom: 40px;
    opacity: 0;
    transform: translateY(60px);
}

.habout-1info:before {
    width: 0%;
    height: 2px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: #fff;
    -webkit-transition: all 0.5s ease 0.7s;
    -moz-transition: all 0.5s ease 0.7s;
    -ms-transition: all 0.5s ease 0.7s;
    -o-transition: all 0.5s ease 0.7s;
    transition: all 0.5s ease 0.7s;
}

.habout-1des {
    float: left;
    width: 54%;
    overflow: hidden;
    font-size: 16px;
    line-height: 30px;
    margin-top: 30px;
    opacity: 0;
    transform: translateY(60px);
}

.habout-1more {
    float: left;
    width: 100%;
    margin-top: 50px;
    opacity: 0;
    transform: translateY(60px);
}

.habout-1more a {
    float: left;
    width: 170px;
    height: 56px;
    line-height: 50px;
    overflow: hidden;
    box-sizing: border-box;
    border: 2px #fff solid;
    border-radius: 2px;
}

.habout-1more span {
    width: 76%;
    display: block;
    overflow: hidden;
    font-size: 16px;
    color: #fff;
    margin: 0px auto;
    position: relative;
}

.habout-1more span:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../images/icon-5.png") no-repeat right center;
}

.habout-1more span:after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../images/icon-5-1.png") no-repeat right center;
    opacity: 0;
}

.habout-1more a:hover {
    background: #fff;
}

.habout-1more a:hover span {
    color: #006ab7;
}

.habout-1more a:hover span:before {
    opacity: 0;
}

.habout-1more a:hover span:after {
    opacity: 1;
}



.section.active .habout-1 .h3 {
    animation: updown 0.6s ease 0.8s 1;
    animation-fill-mode: forwards;
}

.section.active .habout-1info {
    animation: updown 0.6s ease 0.85s 1;
    animation-fill-mode: forwards;
}

.section.active .habout-1info:before {
    width: 100%;
}

.section.active .habout-1des {
    animation: updown 0.6s ease 0.9s 1;
    animation-fill-mode: forwards;
}

.section.active .habout-1more {
    animation: updown 0.6s ease 0.95s 1;
    animation-fill-mode: forwards;
}

.habout ul {
    width: 88.02%;
    position: absolute;
    overflow: hidden;
    left: calc((100% - 88.02%)/2);
    bottom: 0px;
    z-index: 12;
    opacity: 0;
    transform: translateY(60px);
}

.section.active .habout ul {
    animation: updown 0.6s ease 1s 1;
    animation-fill-mode: forwards;
    display: flex;
    justify-content: space-between;
}

.habout ul li {
    flex: 1;
    padding-right: 1px;
    box-sizing: border-box;
    overflow: hidden;
    cursor: pointer;
}

.habout ul li:last-child {
    padding-right: 0px;
    border-radius: 0px 12px 0px 0px;
}

.habout ul li:first-child {
    border-radius: 12px 0px 0px 0px;
}

.habout-item {
    width: 100%;
    height: 170px;
    overflow: hidden;
    background: #fff;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-content: center;
}

.habout-item a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-content: center;
}

.habout-item samp {
    width: 100%;
    display: block;
    overflow: hidden;
    height: 54px;
    position: relative;
}

.habout-item samp img {
    width: auto;
    height: auto;
    max-height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.habout-item samp img:last-child {
    opacity: 0;
}

.habout-item p {
    width: 100%;
    display: block;
    height: 54px;
    text-align: center;
    color: #005799;
    font-size: 20px;
    font-weight: bold;
    line-height: 54px;
}

.habout-item p em {
    font-size: 60px;
    font-family: "dinmed";
}

.habout-item span {
    width: 100%;
    display: block;
    overflow: hidden;
    text-align: center;
    font-size: 16px;
    color: #222;
    margin-top: 20px;
}

.habout ul li:nth-child(5) p,
.habout ul li:nth-child(6) p,
.habout ul li:nth-child(7) p {
    font-size: 40px;
    font-family: "dinmed";
}

.habout ul li:nth-child(1) .habout-item:hover,
.habout ul li:nth-child(2) .habout-item:hover,
.habout ul li:nth-child(3) .habout-item:hover,
.habout ul li:nth-child(4) .habout-item:hover,
.habout ul li:nth-child(5) .habout-item:hover,
.habout ul li:nth-child(6) .habout-item:hover,
.habout ul li:nth-child(7) .habout-item:hover {
    background: #006ab7;
}

.habout ul li:nth-child(1) .habout-item:hover samp img,
.habout ul li:nth-child(2) .habout-item:hover samp img,
.habout ul li:nth-child(3) .habout-item:hover samp img {
    opacity: 0;
}

.habout ul li:nth-child(1) .habout-item:hover samp img:last-child,
.habout ul li:nth-child(2) .habout-item:hover samp img:last-child,
.habout ul li:nth-child(3) .habout-item:hover samp img:last-child {
    opacity: 1;
}

.habout ul li:nth-child(1) .habout-item:hover span,
.habout ul li:nth-child(2) .habout-item:hover span,
.habout ul li:nth-child(3) .habout-item:hover span {
    color: #fff;
}


.habout ul li:nth-child(4) .habout-item:hover p,
.habout ul li:nth-child(5) .habout-item:hover p,
.habout ul li:nth-child(6) .habout-item:hover p,
.habout ul li:nth-child(7) .habout-item:hover p {
    color: #fff;
}

.habout ul li:nth-child(4) .habout-item:hover span,
.habout ul li:nth-child(5) .habout-item:hover span,
.habout ul li:nth-child(6) .habout-item:hover span,
.habout ul li:nth-child(7) .habout-item:hover span {
    color: #fff;
}

/*home-apply*/
.happ {
    width: 100%;
    height: 100vh;
    overflow: hidden;
    position: relative;
}

.happ-bg {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

.happ-bg span {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    position: absolute;
    left: 0px;
    top: 0px;
    opacity: 0;
}

.happ-bg span img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    animation: suofang 60s linear infinite alternate;
}

.happ-bg span.active {
    opacity: 1;
}

.happ-content {
    width: 88.02%;
    position: absolute;
    left: calc((100% - 88.02%)/2);
    top: 100px;
    opacity: 0;
    transform: translateY(60px);
    height: calc(100% - 100px - 132px);
}

.happ-content .swiper-slide {
    color: #fff;
}

.happ-content .swiper-slide-active {
    z-index: 2;
    opacity: 1;
}

.happ-model {
    width: 100%;
    overflow: hidden;
    display: block;
}

.happ-content .swiper-slide .h3 {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 46px;
    position: relative;
    padding-bottom: 25px;
    opacity: 0;
    transform: translateY(60px);
}

.happ-content .swiper-slide .h3:before {
    width: 90px;
    height: 2px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: #fff;
}

.happ-info {
    float: left;
    width: 830px;
    overflow: hidden;
    line-height: 30px;
    font-size: 16px;
    margin-top: 40px;
    opacity: 0;
    transform: translateY(60px);
}

.happ-more {
    float: left;
    width: 100%;
    margin-top: 70px;
    opacity: 0;
    transform: translateY(60px);
}

.happ-more a {
    float: left;
    width: 170px;
    height: 56px;
    line-height: 56px;
    overflow: hidden;
    box-sizing: border-box;
    border: 2px #fff solid;
    border-radius: 2px;
}

.happ-more span {
    width: 76%;
    display: block;
    overflow: hidden;
    font-size: 16px;
    color: #fff;
    margin: 0px auto;
    position: relative;
}

.happ-more span:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../images/icon-5.png") no-repeat right center;
}

.happ-more span:after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../images/icon-5-1.png") no-repeat right center;
    opacity: 0;
}

.happ-more a:hover {
    background: #fff;
}

.happ-more a:hover span {
    color: #006ab7;
}

.happ-more a:hover span:before {
    opacity: 0;
}

.happ-more a:hover span:after {
    opacity: 1;
}

.happ ul {
    width: 88.02%;
    position: absolute;
    left: calc((100% - 88.02%)/2);
    bottom: 0px;
    display: flex;
    justify-content: space-between;
    opacity: 0;
    transform: translateY(60px);
}

/*
.happ ul::before{
    position: absolute;
    left: -42%;
    bottom: 0;
    z-index: -1;
    content: "";
    width: 184%;
    height: 170px;
    background-color: #fff;
    border-radius: 12px 12px 0px 0px;
}
*/
.happ ul li {
    flex: 1;
    padding-right: 1px;
    box-sizing: border-box;
    position: relative;
    height: 240px;
}

.happ ul li:last-child {
    padding-right: 0px;
}

.happ ul li:last-child .happ-item {
    border-radius: 0px 12px 0px 0px;
}

.happ ul li:first-child .happ-item {
    border-radius: 12px 0px 0px 0px;
}

.happ-item {
    width: 100%;
    height: 162px;
    overflow: hidden;
    background: #fff;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-content: center;
    position: absolute;
    left: 0px;
    bottom: 0px;
    width: calc(100% - 1px);
    cursor: pointer;
}

.happ-item:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background-color: #00aacb;
    opacity: 0;
}

.happ-item samp {
    width: 100%;
    overflow: hidden;
    display: block;
    height: 44px;
    position: relative;
    position: relative;
    z-index: 2;
}

.happ-item samp img {
    width: auto;
    height: auto;
    max-height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    opacity: 1;
}

.happ-item samp img:last-child {
    opacity: 0;
}

.happ-item span {
    width: 100%;
    overflow: hidden;
    text-align: center;
    display: block;
    font-size: 18px;
    color: #222;
    margin-top: 20px;
    position: relative;
    z-index: 2;
}

.happ ul li.active {
    flex: 1.2;
}

.happ ul li.active .happ-item {
    height: 200px;
    background: #006ab7;
}

.happ ul li.active .happ-item samp {
    height: 75px;
}

.happ ul li.active .happ-item:before {
    opacity: 1;
}

.happ ul li.active .happ-item samp img {
    opacity: 0;
}

.happ ul li.active .happ-item samp img:last-child {
    opacity: 1;
}

.happ ul li.active .happ-item span {
    font-size: 28px;
    color: #fff;
}

.happ-content .swiper-slide-active .h3 {
    animation: updown 0.6s ease 0.3s 1;
    animation-fill-mode: forwards;
}

.happ-content .swiper-slide-active .happ-info {
    animation: updown 0.6s ease 0.35s 1;
    animation-fill-mode: forwards;
}

.happ-content .swiper-slide-active .happ-more {
    animation: updown 0.6s ease 0.4s 1;
    animation-fill-mode: forwards;
}

.section.active .happ-content {
    animation: updown 0.6s ease 0.7s 1;
    animation-fill-mode: forwards;
}

.section.active .happ ul {
    animation: updown 0.6s ease 0.75s 1;
    animation-fill-mode: forwards;
}

/*home-product*/
.hpro {
    width: 100%;
    height: 100vh;
    overflow: hidden;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.hpro-center {
    width: 88.02%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    margin-top: calc(100px/2);
}

.hpro-top {
    width: 100%;
    overflow: hidden;
    position: relative;
    opacity: 0;
    transform: translateY(60px);
}

.hpro-top .swiper-slide {
    display: block;
}

.hpro-left {
    float: left;
    width: 37%;
    overflow: hidden;
}

.hpro-left .h3 {
    float: left;
    width: 100%;
    overflow: hidden;
    position: relative;
    font-size: 46px;
    color: #333;
    padding-bottom: 25px;
    opacity: 0;
    transform: translateY(60px);
}

.hpro-left .h3:before {
    width: 90px;
    height: 2px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: #006ab7;
}

.hpro-left .h3 a {
    color: #333;
}

.hpro-left .h3 a:hover {
    color: #006ab7;
}

.hpro-ul {
    float: left;
    width: 100%;
    overflow: hidden;
    margin-top: 15px;
}

.hpro-li {
    float: left;
    width: 50%;
    overflow: hidden;
    box-sizing: border-box;
    padding: 0px 15px;
    position: relative;
}

.hpro-li:before {
    width: 4px;
    height: 4px;
    content: "";
    position: absolute;
    left: 0px;
    top: 12px;
    background: #333;
    border-radius: 50%;
}

.hpro-li a {
    font-size: 15px;
    color: #333;
    line-height: 30px;
    font-weight: bold;
}

.hpro-li a:hover {
    color: #006ab7;
}

.hpro-subname {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 18px;
    margin-top: 16px;
    font-weight: bold;
}

.hpro-info {
    float: left;
    width: 100%;
    overflow: hidden;
    line-height: 26px;
    font-size: 16px;
    color: #222;
    margin-top: 6px !important;
    opacity: 0;
    transform: translateY(60px);
}

.hpro-left ul {
    float: left;
    width: 90%;
    overflow: hidden;
    margin-top: 35px;
    display: flex;
    justify-content: space-between;
    opacity: 0;
    transform: translateY(60px);
}

.hpro-left ul li {
    width: auto;
    overflow: hidden;
}

.hpro-left ul li samp {
    width: 70px;
    height: 70px;
    display: block;
    margin: 0px auto;
    position: relative;
    box-sizing: border-box;
    border: 2px #006ab7 dotted;
    border-radius: 50%;
    overflow: hidden;
}

.hpro-left ul li samp:before {
    width: 80%;
    height: 80%;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: #006ab7;
    border-radius: 50%;
}

.hpro-left ul li img {
    width: auto;
    height: auto;
    max-width: 50%;
    max-height: 50%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 12;
}

.hpro-left ul li span {
    width: 100%;
    display: block;
    overflow: hidden;
    margin: 12px auto 0px;
    text-align: center;
    line-height: 22px;
    font-size: 15px;
    color: #333;
}

.hpro-right {
    float: right;
    width: 53.25%;
    overflow: hidden;
    background: url("../images/icon-37.png") no-repeat left bottom;
    text-align: center;
    transform: translateX(-3vw);
    background-size: 100%;
}

.hpro-right img {
    width: 48.22%;
    height: auto;
    margin-bottom: 15%;
    opacity: 0;
}

.hpro-right:hover img {
    transform: scale(1.05);
}

.hpro-top .swiper-slide-active .hpro-left .h3 {
    animation: updown 0.6s ease 1;
    animation-fill-mode: forwards;
}

.hpro-top .swiper-slide-active .hpro-left .hpro-info {
    animation: updown 0.6s ease 0.1s 1;
    animation-fill-mode: forwards;
}

.hpro-top .swiper-slide-active .hpro-left ul {
    animation: updown 0.6s ease 0.2s 1;
    animation-fill-mode: forwards;
}

.hpro-top .swiper-slide-active .hpro-right img {
    opacity: 1;
}

.hpro-button {
    width: 240px;
    position: absolute;
    right: 0px;
    top: 0px;
    z-index: 12;
}

.hpro-button .swiper-button-prev {
    width: 22px;
    height: 12px;
    left: 0px;
    top: 0px;
    margin: 0px;
}

.hpro-button .swiper-button-prev:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../images/icon-24.png") no-repeat center;
}

.hpro-button .swiper-button-prev:after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../images/icon-25.png") no-repeat center;
    transform: rotate(180deg);
    opacity: 0;
}

.hpro-button .swiper-button-prev:hover:before {
    opacity: 0;
}

.hpro-button .swiper-button-prev:hover:after {
    opacity: 1;
}

.hpro-button .swiper-button-next {
    width: 22px;
    height: 12px;
    right: auto;
    bottom: 0px;
    top: 50px;
    margin: 0px;
}

.hpro-button .swiper-button-next:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../images/icon-24.png") no-repeat center;
    transform: rotate(180deg);
}

.hpro-button .swiper-button-next:after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../images/icon-25.png") no-repeat center;
    transform: rotate(0deg);
    opacity: 0;
}

.hpro-button .swiper-button-next:hover:before {
    opacity: 0;
}

.hpro-button .swiper-button-next:hover:after {
    opacity: 1;
}

.hpro-cont {
    float: right;
    width: calc(100% - 40px);
    overflow: hidden;
    position: relative;
}

.hpro-cont .swiper-pagination {
    width: 100%;
    overflow: hidden;
    font-size: 42px;
    color: #006ab7;
    font-family: "dinreg";
    position: relative;
    text-align: left;
}

.hpro-title {
    width: 100%;
    overflow: hidden;
    position: relative;
    margin-top: -10px;
}

.hpro-title span {
    float: left;
    width: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    opacity: 0;
    font-size: 15px;
    color: #333;
    z-index: 1;
}

.hpro-title span.active {
    position: relative;
    opacity: 1;
    z-index: 2;
}

.hpro-bottom {
    width: 100%;
    overflow: hidden;
    margin-top: 3vw;
    position: relative;
    opacity: 0;
    transform: translateY(60px);
}

.hpro-bottom .swiper-container {
    width: 86%;
    overflow: hidden;
    margin: 0px auto;
    position: relative;
}

.hpro-bottom .swiper-container:before {
    width: 50%;
    height: 1px;
    content: "";
    position: absolute;
    left: 0px;
    top: 26px;
    background: -webkit-linear-gradient(left, rgba(217, 217, 217, 0), #d9d9d9 15%);
    background: -moz-linear-gradient(left, rgba(217, 217, 217, 0), #d9d9d9 15%);
    background: -ms-linear-gradient(left, rgba(217, 217, 217, 0), #d9d9d9 15%);
    background: -o-linear-gradient(left, rgba(217, 217, 217, 0), #d9d9d9 15%);
}

.hpro-bottom .swiper-container:after {
    width: 50%;
    height: 1px;
    content: "";
    position: absolute;
    right: 0px;
    top: 26px;
    background: -webkit-linear-gradient(right, rgba(217, 217, 217, 0), #d9d9d9 15%);
    background: -moz-linear-gradient(right, rgba(217, 217, 217, 0), #d9d9d9 15%);
    background: -ms-linear-gradient(right, rgba(217, 217, 217, 0), #d9d9d9 15%);
    background: -o-linear-gradient(right, rgba(217, 217, 217, 0), #d9d9d9 15%);
}

.hpro-nav {
    width: 100%;
    box-sizing: border-box;
    padding: 0px 4%;
    cursor: pointer;
}

.hpro-nav p {
    width: 54px;
    height: 54px;
    display: block;
    margin: 0px auto;
    position: relative;
    overflow: hidden;
}

.hpro-nav p samp {
    width: 59%;
    height: 59%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    box-sizing: border-box;
    border: 1px #e29297 dashed;
    border-radius: 50%;
}

.hpro-nav p samp:before {
    width: 50%;
    height: 50%;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: #f3d4d6;
}

.hpro-nav p samp:after {
    width: 23%;
    height: 23%;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: #006ab7;
}

.hpro-nav span {
    width: 100%;
    display: block;
    overflow: hidden;
    text-align: center;
    margin: 10px auto 0px;
    font-size: 16px;
    color: #333;
}

.hpro-nav em {
    width: 100%;
    display: block;
    overflow: hidden;
    margin-top: 8px;
    height: 70px;
    position: relative;
    animation: ud 1s linear infinite alternate;
}

.hpro-nav em:before {
    width: 100%;
    content: "";
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../images/icon-40.png") no-repeat top center;
}

.hpro-nav em:after {
    width: 100%;
    content: "";
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../images/icon-39.png") no-repeat top center;
    opacity: 0;
}

.hpro-bottom .swiper-slide.active .hpro-nav p samp {
    width: 100%;
    height: 100%;
}

.hpro-bottom .swiper-slide.active .hpro-nav p samp:before {
    width: 60%;
    height: 60%;
}

.hpro-bottom .swiper-slide.active .hpro-nav span {
    font-weight: bold;
}

.hpro-bottom .swiper-slide.active .hpro-nav em:before {
    opacity: 0;
}

.hpro-bottom .swiper-slide.active .hpro-nav em:after {
    opacity: 1;
}

.hpro-bottom .swiper-button-prev {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    opacity: 1;
    background: #e5e5e5 url("../images/icon-41.png") no-repeat center;
    left: 0px;
    top: 16px;
    margin: 0px;
    pointer-events: auto;
    cursor: pointer;
}

.hpro-bottom .swiper-button-next {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    opacity: 1;
    background: #e5e5e5 url("../images/icon-41.png") no-repeat center;
    right: 0px;
    top: 16px;
    margin: 0px;
    transform: rotate(180deg);
    pointer-events: auto;
    cursor: pointer;
}

.hpro-bottom .swiper-button-prev:hover {
    background-color: #006ab7;
}

.hpro-bottom .swiper-button-next:hover {
    background-color: #006ab7;
}

.section.active .hpro-top {
    animation: updown 0.6s ease 0.7s 1;
    animation-fill-mode: forwards;
}

.section.active .hpro-bottom {
    animation: updown 0.6s ease 0.8s 1;
    animation-fill-mode: forwards;
}

/*home-news*/
.hnews {
    width: 100%;
    height: 100vh;
    overflow: hidden;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding-top: 100px;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-content: center;
}

.hnews-head {
    width: 88.02%;
    margin: 0px auto;
    overflow: hidden;
    position: relative;
    opacity: 0;
    transform: translateY(60px);
}

.hnews-head .h3 {
    float: left;
    width: auto;
    overflow: hidden;
    font-size: 46px;
    color: #fff;
}

.hnews-head .swiper-button-next,
.hnews-head .swiper-button {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #fff url("../images/icon-26.png") no-repeat center;
    top: 36px;
}

.hnews-head .swiper-button {
    top: 10px;
    right: 0px;
    position: absolute;
}

.hnews-head .swiper-button a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
}

.hnews-content {
    width: 88.02%;
    overflow: hidden;
    margin: 3vw auto 0px;
    display: flex;
    justify-content: space-between;
    opacity: 0;
    transform: translateY(60px);
}

.hnews-left {
    float: left;
    width: 36.98%;
    overflow: hidden;
    height: 32.29vw;
    background: rgba(255, 255, 255, 0.1);
    position: relative;
}

.hnews-left .swiper-slide {
    height: 100%;
    overflow: hidden;
}

.hnews-left .swiper-slide a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    position: relative;
}

.hnews-pic {
    width: 100%;
    overflow: hidden;
    height: 17.708vw;
    position: relative;
}

.hnews-pic:before {
    width: 100%;
    height: 25%;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    z-index: 12;
    background: -webkit-linear-gradient(top, transparent, rgba(0, 0, 0, 0.7));
    background: -moz-linear-gradient(top, transparent, rgba(0, 0, 0, 0.7));
    background: -ms-linear-gradient(top, transparent, rgba(0, 0, 0, 0.7));
    background: -o-linear-gradient(top, transparent, rgba(0, 0, 0, 0.7));
}

.hnews-pic img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hnews-left:hover img {
    transform: scale(1.04);
}

.hnews-cont {
    width: 100%;
    overflow: hidden;
    height: 14vw;
    position: relative;
    box-sizing: border-box;
    padding: 20px 32px 0px;
}

.hnews-cont .h4 {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 24px;
    color: #fff;
    line-height: 32px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.hnews-info {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 15px;
    color: #fff;
    line-height: 24px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    margin-top: 20px;
}

.hnews-left em {
    width: auto;
    position: absolute;
    left: 32px;
    bottom: 25px;
    font-size: 16px;
    color: #fff;
}

.hnews-left:hover {
    background: #fff;
}

.hnews-left:hover .hnews-cont .h4,
.hnews-left:hover em {
    color: #002122;
}

.hnews-left:hover .hnews-info {
    color: #999;
    opacity: 1;
}

.hnews-left .swiper-pagination {
    left: auto;
    right: 20px;
    top: 16vw;
}

.hnews-left .swiper-pagination span {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #fff;
    opacity: 0.3;
    margin: 0px 6px;
}

.hnews-left .swiper-pagination .swiper-pagination-bullet-active {
    opacity: 1;
}

.hnews-center {
    width: 36.924%;
    overflow: hidden;
    height: 32.29vw;
    display: flex;
    justify-content: space-between;
    align-content: space-between;
    flex-wrap: wrap;
}

.hnews-model {
    width: 100%;
    overflow: hidden;
    height: 31%;
    box-sizing: border-box;
    padding-top: 2px;
    position: relative;
}

.hnews-model:before {
    width: 100%;
    height: 2px;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: #fff;
}

.hnews-model a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    position: relative;
    background: rgba(255, 255, 255, 0.1);
}

.hnews-model span {
    width: 90%;
    display: block;
    overflow: hidden;
    margin: 28px auto 0px;
    font-size: 20px;
    color: #fff;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.hnews-model p {
    width: 90%;
    display: block;
    overflow: hidden;
    margin: 10px auto 0px;
    font-size: 14px;
    color: #fff;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-height: 20px;
}

.hnews-model em {
    width: auto;
    position: absolute;
    left: 5%;
    bottom: 9%;
    font-size: 16px;
    color: #fff;
}

.hnews-model:hover {
    padding-top: 4px;
}

.hnews-model:hover:before {
    height: 4px;
    opacity: 0.4;
}

.hnews-model:hover a {
    background: #fff;
}

.hnews-model:hover span,
.hnews-model:hover em {
    color: #002122;
}

.hnews-model:hover p {
    color: #999;
    opacity: 1;
}

.hnews-right {
    width: 23.66%;
    overflow: hidden;
    height: 32.29vw;
    position: relative;
}

.hnews-right a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    position: relative;
    z-index: 1;
}

.hnews-right a:before {
    width: 100%;
    height: 9vw;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: -webkit-linear-gradient(top, rgba(38, 79, 107, 0.6), rgba(38, 79, 107, 0));
    background: -moz-linear-gradient(top, rgba(38, 79, 107, 0.6), rgba(38, 79, 107, 0));
    background: -ms-linear-gradient(top, rgba(38, 79, 107, 0.6), rgba(38, 79, 107, 0));
    background: -o-linear-gradient(top, rgba(38, 79, 107, 0.6), rgba(38, 79, 107, 0));
    z-index: 3;
}

.hnews-right img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hnews-right:hover img {
    transform: scale(1.04);
}

.hnews-right span {
    width: auto;
    position: absolute;
    left: 30px;
    top: 30px;
    font-size: 24px;
    color: #fff;
    z-index: 5;
}

.section.active .hnews-head {
    animation: updown 0.6s ease 0.80s 1;
    animation-fill-mode: forwards;
}

.section.active .hnews-content {
    animation: updown 0.6s ease 0.85s 1;
    animation-fill-mode: forwards;
}

/*home-pinpai*/
.hpin {
    width: 100%;
    height: 100vh;
    overflow: hidden;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
}

.hpin-1 {
    width: 123vh;
    height: 123vh;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0);
    background: url("../images/icon-30.png") no-repeat center;
    background-size: cover;
    margin-top: calc(100px/2);
    -webkit-transition: all 1s ease 0.6s;
    -moz-transition: all 1s ease 0.6s;
    -ms-transition: all 1s ease 0.6s;
    -o-transition: all 1s ease 0.6s;
    transition: all 1s ease 0.6s;
    opacity: 0;
}

.hpin-2 {
    width: 89.5vh;
    height: 89.5vh;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border: 1px rgba(255, 255, 255, 0.15) solid;
    border-radius: 50%;
}

.hpin-2left {
    width: auto;
    position: absolute;
    left: -29.4%;
    top: 50%;
    transform: translateY(-50%);
}

.hpin-2left img {
    float: left;
    width: 24.07vh;
    height: auto;
}

.hpin-2left span {
    float: left;
    margin: 8px 0px 0px 4px;
    width: 3.63vh;
    height: 3.63vh;
    position: relative;
}

.hpin-2left span:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../images/icon-29.png") no-repeat center;
    background-size: 100%;
    animation: quan1 6s linear infinite;
}

.hpin-2left span:after {
    width: 37%;
    height: 37%;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: #006ab7;
}

.hpin-2right {
    width: auto;
    position: absolute;
    right: -27.3%;
    top: 50%;
    transform: translateY(-50%);
}

.hpin-2right img {
    float: right;
    width: 20.44vh;
    height: auto;
}

.hpin-2right span {
    float: left;
    margin: 8px 2vh 0px 0px;
    width: 3.63vh;
    height: 3.63vh;
    position: relative;
}

.hpin-2right span:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../images/icon-29.png") no-repeat center;
    background-size: 100%;
    animation: quan1 6s linear infinite;
}

.hpin-2right span:after {
    width: 37%;
    height: 37%;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: #006ab7;
}

.hpin-3 {
    width: 53.86vh;
    height: 53.86vh;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-content: center;
}

.hpin-3:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../images/icon-31.png") no-repeat center;
    background-size: 100%;
    animation: quan1 10s linear infinite;
}

.hpin-3:after {
    width: 90%;
    height: 90%;
    content: "";
    position: absolute;
    left: 5%;
    top: 5%;
    background: url("../images/icon-32.png") no-repeat center;
    background-size: 100%;
    animation: quan2 10s linear infinite;
}

.hpin-3 .h3 {
    width: 100%;
    text-align: center;
    font-size: 50px;
    color: #333;
    overflow: hidden;
}

.hpin-3 samp {
    width: 100%;
    display: block;
    overflow: hidden;
    text-align: center;
    margin-top: 11vh;
}

.hpin-3 samp img {
    width: auto;
    height: 12.41vh;
}

.section.active .hpin-1 {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
}

/*news*/
.banner-news {
    width: 100%;
    overflow: hidden;
    position: relative;
    margin-top: 100px;
    height: 31.2vw;
}

.banner-news img {
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: block;
    animation: suofang 80s linear infinite alternate;
    object-fit: cover;
}

.banner-center {
    width: 81.25%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 12;
    color: #fff;
}

.banner-center .h3 {
    width: 100%;
    overflow: hidden;
    font-size: 46px;
}

.banner-center p {
    width: 100%;
    overflow: hidden;
    font-size: 24px;
    font-family: "Arial";
    margin-top: 5px;
}

.banner-info {
    width: 40%;
    overflow: hidden;
    line-height: 28px;
    font-size: 18px;
    margin-top: 10px;
}

.bread-nav {
    width: 100%;
    overflow: hidden;
    height: 60px;
    line-height: 60px;
    background: #335ca8;
}

.bread-nav ul {
    width: 81.25%;
    overflow: hidden;
    margin: 0px auto;
    height: 100%;
}

.bread-nav ul li {
    float: left;
    width: auto;
    padding: 0px 40px;
    overflow: hidden;
    height: 100%;
    position: relative;
}

.bread-nav ul li:first-child {
    padding-left: 0px;
}

.bread-nav ul li:before {
    width: 2px;
    height: 30%;
    content: "";
    position: absolute;
    right: 0px;
    top: 35%;
    background: #ccc;
}

.bread-nav ul li a {
    float: left;
    width: auto;
    height: 100%;
    position: relative;
    padding: 0px 10px;
    font-size: 16px;
    color: #fff;
    cursor: pointer;
}

.bread-nav ul li a:before {
    width: 0%;
    height: 3px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: #fff;
}

.bread-nav ul li.active a:before,
.bread-nav ul li:hover a:before {
    width: 100%;
}

.bread-nav ul li:last-child:before {
    opacity: 0;
}

.news {
    width: 100%;
    overflow: hidden;
    padding-bottom: 126px;
}

.news-form {
    width: 100%;
    overflow: hidden;
    background: #f5f5f5;
    padding: 50px 0px;
}

.news-center {
    width: 81.25%;
    overflow: hidden;
    margin: 0px auto;
}

.news-form form {
    float: left;
    width: auto;
    overflow: hidden;
}

.news-form label {
    float: left;
    width: auto;
    overflow: hidden;
    line-height: 60px;
    font-size: 22px;
    color: #006ab7;
}

.news-input {
    float: left;
    width: 27vw;
    overflow: hidden;
    box-sizing: border-box;
    height: 50px;
    line-height: 50px;
    border: 1px #dbdbdb solid;
    background: #fff;
    margin-left: 15px;
    padding: 0px 32px;
}

.news-input .txt {
    float: left;
    width: 87%;
    height: 100%;
    overflow: hidden;
    font-size: 16px;
    color: #666;
}

.news-input .txt::placeholder {
    color: #666 !important;
    opacity: 1;
}

.news-input .txt::-webkit-input-placeholder {
    color: #666 !important;
    opacity: 1;
}

.news-input .txt::-ms-input-placeholder {
    color: #666 !important;
    opacity: 1;
}

.news-input .txt::-moz-placeholder {
    color: #666 !important;
    opacity: 1;
}

.news-input .bt {
    float: right;
    width: 18px;
    height: 100%;
    overflow: hidden;
    background: url("../images/icon-2-1.png") no-repeat center;
    cursor: pointer;
}

.news-right {
    float: left;
    width: auto;
    overflow: hidden;
    margin-left: 1.04vw;
}

.news-right span {
    float: left;
    width: 5.313vw;
    overflow: hidden;
    margin: 12px 0px 0px 1.5vw;
    box-sizing: border-box;
    height: 30px;
    line-height: 30px;
    border-radius: 15px;
    border: 1px #006ab7 solid;
    text-align: center;
}

.news-right span a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    text-align: center;
    font-size: 14px;
    color: #222;
}

.news-right span.active,
.news-right span:hover {
    background: #006ab7;
}

.news-right span.active a,
.news-right span:hover a {
    color: #fff;
}

.news-top {
    width: 81.25%;
    overflow: hidden;
    margin: 60px auto 0px;
    display: flex;
    justify-content: space-between;
}

.news-1 {
    width: 49.15%;
    overflow: hidden;
    height: 20.834vw;
}

.news-1 a {
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: block;
    position: relative;
}

.news-1 a:before {
    width: 100%;
    height: 100px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    z-index: 1;
    background: -webkit-linear-gradient(top, transparent, rgba(0, 0, 0, 0.7));
    background: -moz-linear-gradient(top, transparent, rgba(0, 0, 0, 0.7));
    background: -ms-linear-gradient(top, transparent, rgba(0, 0, 0, 0.7));
    background: -o-linear-gradient(top, transparent, rgba(0, 0, 0, 0.7));
}

.news-1 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.news-1:hover img {
    transform: scale(1.02);
}

.news-time {
    width: 80px;
    position: absolute;
    z-index: 12;
    background: #006ab7;
    left: 40px;
    top: 0px;
    color: #fff;
    padding-bottom: 10px;
}

.news-time span {
    width: 100%;
    overflow: hidden;
    text-align: center;
    display: block;
    font-size: 40px;
    font-family: "dinreg";
}

.news-time em {
    width: 100%;
    overflow: hidden;
    text-align: center;
    display: block;
    font-size: 14px;
}

.news-1 p {
    width: 100%;
    overflow: hidden;
    position: absolute;
    left: 0px;
    bottom: 25px;
    box-sizing: border-box;
    padding: 0px 40px;
    font-size: 24px;
    color: #fff;
    z-index: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.news-list {
    width: 81.25%;
    overflow: hidden;
    margin: 8px auto 0px;
}

.news-item {
    width: 100%;
    overflow: hidden;
    padding: 30px 0px !important;
    position: relative;
}

.news-item:before {
    width: 100%;
    height: 1px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: #ebebeb;
}

.news-item:after {
    width: 0%;
    height: 1px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: #006ab7;
    z-index: 2;
}

.news-item a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.news-item samp {
    width: 430px;
    height: 280px;
    overflow: hidden;
    display: block;
    border-radius: 5px;
}

.news-item samp img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.news-item:hover samp img {
    transform: scale(1.02);
}

.news-model {
    width: calc(100% - 510px);
    overflow: hidden;
}

.news-model span {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 32px;
    color: #222;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.news-model p {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 16px;
    color: #666;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-height: 26px;
    margin-top: 14px;
    min-height: 78px;
}

.news-model em {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 18px;
    color: #006ab7;
    font-family: "dinreg";
    margin-top: 40px;
}

.news-item:hover:after {
    width: 100%;
}

.news-item:hover span {
    color: #006ab7;
}

.news-item:last-child:before,
.news-item:last-child:after {
    display: none;
}

.news-page {
    width: 81.25%;
    overflow: hidden;
    margin: 60px auto 0px;
    text-align: center;
}

.news-page a {
    width: auto;
    height: 35px;
    line-height: 35px;
    display: inline-block;
    overflow: hidden;
    margin: 0px 4px;
    vertical-align: top;
    background: #f7f7f7;
    font-size: 14px;
    color: #767676;
    padding: 0px 13px;
}

.news-page a.active,
.news-page a:hover {
    background: #006ab7;
    color: #fff;
}

/*news-info*/
.detail {
    width: 100%;
    overflow: hidden;
    padding: 90px 0px;
    background: #f7f7f7;
}

.detail-center {
    width: 81.25%;
    margin: 0px auto;
    overflow: hidden;
    background: #fff;
    box-sizing: border-box;
    padding: 80px;
}

.detail-center .h1 {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 36px;
    color: #222;
    font-weight: bold;
}

.detail-time {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 16px;
    color: #999;
    margin-top: 20px;
    position: relative;
}

.detail-time em {
    position: absolute;
    left: calc(50% + 200px);
    top: 0px;
}

.detail-content {
    width: 100%;
    overflow: hidden;
    line-height: 26px;
    font-size: 16px;
    color: #222;
    margin-top: 70px;
}

.detail-content img {
    width: auto;
    height: auto;
    max-width: 100%;
}

.detail-content p {
    margin-bottom: 30px;
}

.detail-page {
    width: 100%;
    overflow: hidden;
    margin-top: 110px;
    border-top: 1px #e5ebf3 solid;
    padding-top: 32px;
}

.detail-page span {
    float: left;
    width: 100%;
    overflow: hidden;
    line-height: 30px;
    font-size: 16px;
    color: #222;
}

.detail-page span:hover {
    transform: translateX(5px);
}

.detail-page span a {
    color: #222;
}

.detail-page span a:hover {
    color: #006ab7;
}

/*video*/
.news-form.vd {
    background: #fff;
    padding: 0px;
    margin-top: 55px;
}

.news-form.vd form {
    float: right;
}

.vd-1 {
    float: left;
    width: auto;
    overflow: hidden;
}

.vd-1 span {
    float: left;
    height: 52px;
    line-height: 52px;
    margin-top: 4px;
    overflow: hidden;
    width: 7.813vw;
    box-sizing: border-box;
    margin-right: 18px;
    border: 1px #e4e4e4 solid;
    text-align: center;
}

.vd-1 span a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    text-align: center;
    font-size: 16px;
    color: #999;
}

.vd-1 span:last-child {
    margin-right: 0px;
}

.vd-1 span.active,
.vd-1 span:hover {
    background: #006ab7;
    border-color: #006ab7;
}

.vd-1 span.active a,
.vd-1 span:hover a {
    color: #fff;
}

.vd-list {
    width: 81.25%;
    overflow: hidden;
    margin: 0px auto;
    padding-bottom: 70px;
}

.vd-item {
    float: left;
    width: 32%;
    overflow: hidden;
    margin: 55px 2% 0px 0px;
    cursor: pointer;
}

.vd-item:nth-child(3n) {
    margin-right: 0px;
}

.vd-top {
    width: 100%;
    height: 15.62vw;
    overflow: hidden;
    position: relative;
}

.vd-top:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: rgba(34, 34, 34, 0.3);
    z-index: 1;
}

.vd-top img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.vd-item:hover .vd-top img {
    transform: scale(1.02);
}

.vd-top span {
    width: 3.907vw;
    height: 3.907vw;
    display: block;
    overflow: hidden;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: url("../images/icon-42.png") no-repeat center;
    background-size: 100%;
    z-index: 12;
}

.vd-bottom {
    width: 100%;
    overflow: hidden;
    margin-top: 24px;
}

.vd-bottom span {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 20px;
    color: #222;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    text-align: center;
}

.vd-bottom p {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 20px;
    color: #222;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    margin-top: 10px;
    text-align: center;
}

/*about-company*/
.about-1 {
    width: 100%;
    overflow: hidden;
    padding: 110px 0px 140px;
}

.about-1 .h3 {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 42px;
    color: #222;
    font-weight: bold;
    position: relative;
    padding-bottom: 20px;
}

.about-1 .h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    background: #006ab7;
}

.about-1content {
    width: 81.25%;
    overflow: hidden;
    margin: 90px auto 0px;
}

.about-1content .h4 {
    float: left;
    width: 50.44%;
    overflow: hidden;
    position: relative;
    font-size: 26px;
    color: #222;
    font-weight: bold;
    padding-bottom: 26px;
}

.about-1content .h4:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 0%;
    bottom: 0px;
    background: #006ab7;
}

.about-1video {
    float: right;
    width: 43%;
    overflow: hidden;
    position: relative;
    cursor: pointer;
}

.about-1video img {
    display: none;
}

.about-1video span {
    width: 53px;
    height: 53px;
    display: block;
    overflow: hidden;
    background: url("../images/icon-43.png") no-repeat center;
    background-size: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.about-1video video {
    width: 100%;
    height: auto;
    display: block;
    overflow: hidden;
    object-fit: cover;
}

.about-1info {
    float: left;
    width: 53%;
    overflow: hidden;
    line-height: 30px;
    font-size: 16px;
    color: #666;
    margin-top: 30px;
}

.about-1info img {
    width: 100%;
    height: auto;
    overflow: hidden;
}

.about-1 ul {
    width: 81.25%;
    overflow: hidden;
    margin: 90px auto 0px;
    display: flex;
    justify-content: space-between;
}

.about-1 ul li {
    width: auto;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.about-1 ul li samp {
    width: 48px;
    height: 48px;
    overflow: hidden;
    display: block;
    position: relative;
    padding-right: 28px;
}

.about-1 ul li samp img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    position: absolute;
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
}

.about-1item {
    width: auto;
    overflow: hidden;
    padding-left: 28px;
    position: relative;
}

.about-1item:before {
    width: 1px;
    height: 60%;
    content: "";
    position: absolute;
    left: 0px;
    top: 25%;
    background: #f9e9ea;
}

.about-1item span {
    width: 100%;
    overflow: hidden;
    font-size: 20px;
    color: #006ab7;
    font-weight: bold;
}

.about-1item span em {
    font-size: 60px;
    font-family: "dinmed";
}

.about-1 ul li:nth-child(2) .about-1item span,
.about-1 ul li:nth-child(3) .about-1item span,
.about-1 ul li:nth-child(4) .about-1item span {
    font-size: 40px;
    font-family: "dinmed";
}

.about-1 ul li p {
    width: 100%;
    overflow: hidden;
    font-size: 16px;
    color: #222;
}

.about-2 {
    width: 100%;
    overflow: hidden;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    height: 500px;
}

.about-2 .h3 {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 58px;
    color: #fff;
    font-weight: bold;
    margin-top: 140px;
    white-space: pre;
}

.about-2 .h3 span {
    color: #ff0010;
}

.about-3 {
    width: 100%;
    overflow: hidden;
    padding-top: 110px;
}

.about-3 .h3 {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 42px;
    color: #222;
    font-weight: bold;
    position: relative;
    padding-bottom: 20px;
}

.about-3 .h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    background: #006ab7;
}

.about-3content {
    width: 81.25%;
    overflow: hidden;
    margin: 50px auto 0px;
    display: flex;
    justify-content: space-between;
}

.about-3item {
    flex: 1;
    height: 530px;
    overflow: hidden;
    position: relative;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    margin-right: 1px;
}

.about-3item:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: rgba(0, 0, 0, 0.2);
}

.about-3item.active {
    flex: 2.49;
}

.about-3item.active:before {
    background: rgba(0, 0, 0, 0.3);
}

.about-3center {
    width: 100%;
    overflow: hidden;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 12;
}

.about-3center span {
    width: 100%;
    overflow: hidden;
    display: block;
    text-align: center;
    font-size: 24px;
    color: #fff;
}

.about-3center p {
    width: 100%;
    overflow: hidden;
    line-height: 28px;
    font-size: 18px;
    color: #fff;
    margin-top: 0px;
    max-height: 0px;
    opacity: 0;
}

.about-3item.active .about-3center {
    width: 86%;
    top: 60px;
    transform: translate(-50%, 0px);
}

.about-3item.active .about-3center span {
    text-align: left;
    font-size: 36px;
    animation: wenhua 1s ease 1;
    animation-fill-mode: forwards;
    opacity: 0;
}

.about-3item.active .about-3center p {
    max-height: 100px;
    margin-top: 20px;
    animation: wenhua 1s ease 0.1s 1;
    animation-fill-mode: forwards;
}

.about-4 {
    width: 100%;
    overflow: hidden;
    padding: 80px 0px 120px;
    background: #f5f5f5;
    margin-top: 120px;
}

.about-4 .h3 {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 42px;
    color: #222;
    font-weight: bold;
    position: relative;
    padding-bottom: 20px;
}

.about-4 .h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    background: #006ab7;
}

.about-4nav {
    width: 81.25%;
    overflow: hidden;
    margin: 100px auto 0px;
    position: relative;
}

.about-4nav:before {
    width: 100%;
    height: 2px;
    content: "";
    position: absolute;
    left: 0px;
    top: 63px;
    background: #ccc;
}

.about-4line {
    height: 2px;
    content: "";
    position: absolute;
    left: 0px;
    top: 63px;
    background: #006ab7;
    z-index: 12;
    -webkit-transition: all 0.6s ease 0s;
    -moz-transition: all 0.6s ease 0s;
    -ms-transition: all 0.6s ease 0s;
    -o-transition: all 0.6s ease 0s;
    transition: all 0.6s ease 0s;
}

.about-4left {
    width: 44px;
    height: 44px;
    position: absolute;
    left: 0px;
    top: 41px;
    border-radius: 50%;
    background: #006ab7;
    z-index: 40;
}

.about-4left:before {
    width: 6px;
    height: 6px;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: #fff;
}

.about-4right {
    width: 44px;
    height: 44px;
    position: absolute;
    right: 0px;
    top: 41px;
    border-radius: 50%;
    background: #006ab7;
    z-index: 40;
}

.about-4right:before {
    width: 6px;
    height: 6px;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: #fff;
}

.about-4nav .swiper-container {
    width: 94%;
    margin: 0px auto;
    overflow: hidden;
    position: relative;
    z-index: 33;
}

.about-4nav .swiper-slide {
    cursor: pointer;
}

.about-4nav .about-4model {
    width: 100%;
    overflow: hidden;
}

.about-4nav .about-4model span {
    width: 100%;
    display: block;
    overflow: hidden;
    text-align: center;
    font-size: 24px;
    color: rgba(51, 51, 51, 0.5);
    -webkit-transition: all 0.5s ease 0s;
    -moz-transition: all 0.5s ease 0s;
    -ms-transition: all 0.5s ease 0s;
    -o-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}

.about-4nav .about-4model em {
    width: 28px;
    height: 28px;
    display: block;
    overflow: hidden;
    margin: 12px auto 0px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.05);
    position: relative;
    -webkit-transition: all 0.5s ease 0s;
    -moz-transition: all 0.5s ease 0s;
    -ms-transition: all 0.5s ease 0s;
    -o-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}

.about-4nav .about-4model em samp {
    width: 18px;
    height: 18px;
    display: block;
    overflow: hidden;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    border: 1px #ccc solid;
    background: #fff;
    box-sizing: border-box;
    -webkit-transition: all 0.5s ease 0s;
    -moz-transition: all 0.5s ease 0s;
    -ms-transition: all 0.5s ease 0s;
    -o-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}

.about-4nav .about-4model em samp:before {
    width: 6px;
    height: 6px;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: #cfcfcf;
    -webkit-transition: all 0.5s ease 0s;
    -moz-transition: all 0.5s ease 0s;
    -ms-transition: all 0.5s ease 0s;
    -o-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}

.about-4nav .about-4model p {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 22px;
    color: rgba(51, 51, 51, 0.5);
    margin-top: 12px;
    -webkit-transition: all 0.5s ease 0s;
    -moz-transition: all 0.5s ease 0s;
    -ms-transition: all 0.5s ease 0s;
    -o-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}

.about-4nav .swiper-slide.active .about-4model span {
    color: #006ab7;
}

.about-4nav .swiper-slide.active .about-4model em {
    background: rgba(198, 38, 48, 0.11);
}

.about-4nav .swiper-slide.active .about-4model em samp {
    border-color: #006ab7;
}

.about-4nav .swiper-slide.active .about-4model em samp:before {
    background: #006ab7;
}

.about-4nav .swiper-slide.active .about-4model p {
    color: #006ab7;
}

.about-4content {
    width: 100%;
    overflow: hidden;
    margin-top: 120px;
    position: relative;
}

.about-4content .swiper-container {
    width: 81.25%;
    margin: 0px auto;
}

.about-4pannel {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.about-4item {
    float: left;
    width: 60%;
    overflow: hidden;
    height: 30vw;
    background: #fff url("../images/about-20.jpg") no-repeat;
    background-size: cover;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.about-4date {
    width: auto;
    position: absolute;
    left: 52%;
    top: 5%;
    font-size: 110px;
    color: #fff;
    font-family: "dinbold";
    -webkit-text-stroke: 1px #efefef;
    text-stroke: 1px #efefef;
    -webkit-transition: all 0.6s ease 0.4s;
    -moz-transition: all 0.6s ease 0.4s;
    -ms-transition: all 0.6s ease 0.4s;
    -o-transition: all 0.6s ease 0.4s;
    transition: all 0.6s ease 0.4s;
    opacity: 0;
    transform: translateY(60px);
}

.about-4list {
    width: 70%;
    height: 72%;
    overflow: hidden;
    margin-left: 11%;
    -webkit-transition: all 0.6s ease 0.5s;
    -moz-transition: all 0.6s ease 0.5s;
    -ms-transition: all 0.6s ease 0.5s;
    -o-transition: all 0.6s ease 0.5s;
    transition: all 0.6s ease 0.5s;
    opacity: 0;
    transform: translateY(60px);
}

.about-4li {
    float: left;
    width: 100%;
    box-sizing: border-box;
    padding-left: 24px;
    padding-bottom: 30px;
    min-height: 100px;
    position: relative;
}

.about-4li:before {
    width: 7px;
    height: 7px;
    content: "";
    position: absolute;
    left: 0px;
    top: 10px;
    border-radius: 50%;
    background: #006ab7;
    display: block;
    overflow: hidden;
}

.about-4li:after {
    width: 2px;
    height: 100%;
    content: "";
    position: absolute;
    left: 2px;
    top: 12px;
    display: block;
    overflow: hidden;
    background: url("../images/icon-155.png") repeat-y top center;
}

.about-4li:last-child:after {
    display: none;
}

.about-4li:last-child {
    padding-bottom: 0px;
    min-height: inherit;
}

.about-4li span {
    width: 100%;
    overflow: hidden;
    display: block;
    font-size: 22px;
    color: #006ab7;
}

.about-4li p {
    width: 100%;
    overflow: hidden;
    display: block;
    font-size: 19px;
    color: #333;
    line-height: 32px;
    margin-top: 12px;
}

.about-4pic {
    width: 50%;
    height: 24vw;
    position: absolute;
    right: 0px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 12;
    overflow: hidden;
}

.about-4pic img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.about-4pic:hover img {
    transform: scale(1.03);
}

.about-4content .swiper-slide-active .about-4date,
.about-4content .swiper-slide-active .about-4list {
    opacity: 1;
    transform: translateY(0px);
}

.about-4content .mCSB_inside>.mCSB_container {
    padding-right: 20px;
}

.about-4content .mCSB_scrollTools {
    width: 12px;
}

.about-4content .mCSB_scrollTools:before {
    background: #f2f2f2;
}

.about-4content .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background: #f00;
}

.about-4content .swiper-button-prev {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #e4e4e4 url("../images/icon-5.png") no-repeat center;
    -webkit-transition: all 0.6s ease 0s;
    -moz-transition: all 0.6s ease 0s;
    -ms-transition: all 0.6s ease 0s;
    -o-transition: all 0.6s ease 0s;
    transition: all 0.6s ease 0s;
    transform: rotate(180deg);
    left: 4%;
}

.about-4content .swiper-button-next {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #e4e4e4 url("../images/icon-5.png") no-repeat center;
    -webkit-transition: all 0.6s ease 0s;
    -moz-transition: all 0.6s ease 0s;
    -ms-transition: all 0.6s ease 0s;
    -o-transition: all 0.6s ease 0s;
    transition: all 0.6s ease 0s;
    right: 4%;
}

.about-4content .swiper-button-prev:hover,
.about-4content .swiper-button-next:hover {
    background-color: #333;
}

.about-5 {
    width: 100%;
    overflow: hidden;
    padding: 110px 0px 90px;
}

.about-5 .h3 {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 42px;
    color: #222;
    font-weight: bold;
    position: relative;
    padding-bottom: 20px;
}

.about-5 .h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    background: #006ab7;
}

.about-5content {
    width: 81.25%;
    margin: 53px auto 0px;
    position: relative;
}

.about-5pannel {
    width: 100%;
    display: none;
}

.about-5pannel.active {
    display: block;
}

.about-5item {
    width: 100%;
    overflow: hidden;
}

.about-5top {
    width: 100%;
    height: 12vw;
    overflow: hidden;
    position: relative;
}

.about-5top em {
    display: none;
}

.about-5top img {
    width: 100%;
    height: 100%;
}

.about-5item:hover img {
    transform: scale(1.03);
}

.about-5item span {
    width: 100%;
    overflow: hidden;
    display: none;
    font-size: 20px;
    color: #333;
    box-sizing: border-box;
    padding: 0px 25px;
    margin-top: 25px;
    text-align: center;
}

.about-5 ul {
    width: 100%;
    overflow: hidden;
    text-align: center;
    margin-top: 90px;
    text-align: center;
}

.about-5 ul li {
    width: 250px;
    height: 70px;
    line-height: 70px;
    overflow: hidden;
    display: inline-block;
    margin: 0px 30px;
    box-sizing: border-box;
    border: 1px #006ab7 solid;
    text-align: center;
    cursor: pointer;
    font-size: 18px;
    color: #666;
}

.about-5 ul li.active {
    background: #006ab7;
    color: #fff;
}

.about-5pannel .swiper-button-prev {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #e5e5e5 url("../images/icon-59.png") no-repeat center;
    left: -90px;
}

.about-5pannel .swiper-button-next {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #e5e5e5 url("../images/icon-59.png") no-repeat center;
    right: -90px;
    transform: rotate(180deg);
}

.about-5pannel .swiper-button-prev:hover,
.about-5pannel .swiper-button-next:hover {
    background-color: #006ab7;
}

/*about-keji*/
.kj-1 {
    width: 81.25%;
    overflow: hidden;
    margin: 110px auto 0px;
}

.kj-1 .h3 {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 42px;
    font-weight: bold;
    color: #333;
    position: relative;
    padding-bottom: 20px;
}

.kj-1 .h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    background: #006ab7;
}

.kj-1info {
    width: 85%;
    overflow: hidden;
    margin: 20px auto 0px;
    line-height: 30px;
    font-size: 20px;
    color: #333;
    text-align: center;
}

.kj-2 {
    width: 81.25%;
    overflow: hidden;
    margin: 0px auto;
    padding-bottom: 150px;
}

.kj-pannel {
    width: 100%;
    overflow: hidden;
    margin-top: 90px;
    padding-bottom: 40px;
}

.kj-pic {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.kj-pic samp {
    float: left;
    width: 100%;
    overflow: hidden;
}

.kj-pic samp img {
    width: 100%;
    height: auto;
}

.kj-pic:hover samp img {
    transform: scale(1.03);
}

.kj-center {
    width: 90%;
    position: absolute;
    left: 5%;
    top: 29%;
}

.kj-center span {
    width: 100%;
    overflow: hidden;
    display: block;
}

.kj-center p {
    width: 100%;
    overflow: hidden;
    font-size: 36px;
    color: #fff;
    margin-top: 12px;
}

.kj-2 ul {
    width: 90%;
    overflow: hidden;
    margin: 0px auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 27px;
}

.kj-2 ul li {
    width: 40%;
    overflow: hidden;
    margin-top: 28px;
}

.kj-2 ul li em {
    float: left;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    overflow: hidden;
    background: #006ab7;
    position: relative;
}

.kj-2 ul li em img {
    width: auto;
    height: auto;
    max-width: 40%;
    max-height: 40%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.kj-2 ul li p {
    float: right;
    width: calc(100% - 75px);
    overflow: hidden;
    line-height: 32px;
    font-size: 16px;
    color: #333;
    margin-top: 5px;
}

.kj-2 ul li:nth-child(2n) {
    width: 50%;
}

/*about-join*/
.join {
    width: 100%;
    overflow: hidden;
    padding: 110px 0px 140px;
}

.join .h3 {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 42px;
    font-weight: bold;
    color: #333;
    position: relative;
    padding-bottom: 20px;
}

.join .h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    background: #006ab7;
}

.join-content {
    width: 81.25%;
    overflow: hidden;
    margin: 60px auto 0px;
}

.join-item {
    float: left;
    width: 50%;
    overflow: hidden;
    position: relative;
}

.join-item a {
    width: 100%;
    overflow: hidden;
    display: block;
    height: 100%;
}

.join-item samp {
    float: left;
    width: 100%;
    overflow: hidden;
    position: relative;
}

.join-item samp:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: #006ab7;
    opacity: 0;
    z-index: 2;
}

.join-item samp img {
    width: 100%;
    height: auto;
}

.join-item:hover samp img {
    transform: scale(1.03);
}

.join-item:hover samp:before {
    opacity: 0.8;
}

.join-center {
    width: 100%;
    overflow: hidden;
    position: absolute;
    left: 0px;
    top: 38px;
    z-index: 12;
}

.join-center span {
    float: left;
    width: 100%;
    overflow: hidden;
    height: 62px;
    position: relative;
}

.join-center span img {
    width: auto;
    height: auto;
    max-height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.join-center p {
    float: left;
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 26px;
    color: #fff;
    font-weight: bold;
    margin-top: 18px;
}

.join-item:hover .join-center {
    top: 50%;
    transform: translateY(-50%);
}

/*about-contact*/
.contact {
    width: 100%;
    overflow: hidden;
    padding: 110px 0px;
}

.contact .h3 {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 42px;
    font-weight: bold;
    color: #333;
    position: relative;
    padding-bottom: 20px;
}

.contact .h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    background: #006ab7;
}

.contact-1 {
    width: 68.75%;
    overflow: hidden;
    margin: 60px auto 0px;
    position: relative;
}

.contact-1 samp {
    float: left;
    width: 100%;
    overflow: hidden;
}

.contact-1 samp img {
    width: 100%;
    height: auto;
}

.contact-1:hover samp img {
    transform: scale(1.03);
}

.contact-1ver {
    width: 90%;
    position: absolute;
    left: 60px;
    bottom: 60px;
    z-index: 12;
    color: #fff;
}

.contact-1ver span {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 36px;
}

.contact-1ver p {
    float: left;
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    line-height: 26px;
    font-size: 18px;
    padding-left: 40px;
    background: url("../images/icon-70.png") no-repeat left 0px;
    margin-top: 20px;
}

.contact-2 {
    width: 68.75%;
    overflow: hidden;
    margin: 14px auto 0px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.contact-2item {
    width: 48.15%;
    overflow: hidden;
    margin-top: 40px;
    position: relative;
    height: 19.78vw;
    position: relative;
    cursor: pointer;
}

.contact-2item:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: rgba(198, 38, 48, 0.8);
    z-index: 1;
    opacity: 0;
}

.contact-2item img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.contact-2item:hover img {
    transform: scale(1.03);
}

.contact-2cont {
    width: 88%;
    position: absolute;
    left: 6%;
    top: 81%;
    z-index: 2;
    color: #fff;
}

.contact-2cont span {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 28px;
}

.contact-2info {
    float: left;
    width: 100%;
    overflow: hidden;
    line-height: 28px;
    font-size: 16px;
    margin-top: 50px;
    opacity: 0;
    -webkit-transition: all 0.5s ease 0.2s;
    -moz-transition: all 0.5s ease 0.2s;
    -ms-transition: all 0.5s ease 0.2s;
    -o-transition: all 0.5s ease 0.2s;
    transition: all 0.5s ease 0.2s;
    height: 12vw;
}

.contact-2item:hover:before {
    opacity: 1;
}

.contact-2item:hover .contact-2cont {
    top: 10%;
}

.contact-2item:hover .contact-2info {
    opacity: 1;
    margin-top: 10px;
}

.contact-3 {
    width: 68.75%;
    margin: 20px auto 0px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.contact-3item {
    width: 32%;
    overflow: hidden;
    margin-top: 30px;
    background: #f7f7f7;
    padding: 40px 0px;
    cursor: pointer;
}

.contact-3item:nth-child(n+4) {
    width: 49%;
}

.contact-3item a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.contact-3item samp {
    width: 100%;
    height: 33px;
    display: block;
    position: relative;
}

.contact-3item samp img {
    width: auto;
    height: auto;
    max-height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.contact-3item samp img:last-child {
    opacity: 0;
}

.contact-3item span {
    width: 100%;
    display: block;
    overflow: hidden;
    text-align: center;
    font-size: 16px;
    color: #333;
    margin-top: 15px;
}

.contact-3item p {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 20px;
    color: #333;
    margin-top: 12px;
}

.contact-3item:hover {
    background: #006ab7;
}

.contact-3item:hover samp img {
    opacity: 0;
}

.contact-3item:hover samp img:last-child {
    opacity: 1;
}

.contact-3item:hover span,
.contact-3item:hover p {
    color: #fff;
}

/*about-join-boshi*/
.join-boshi {
    width: 100%;
    overflow: hidden;
    padding: 90px 0px 120px;
}

.join-1 {
    width: 81.25%;
    overflow: hidden;
    margin: 0px auto;
}

.join-boshi .h3 {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 42px;
    font-weight: bold;
    color: #333;
    position: relative;
    padding-bottom: 20px;
}

.join-boshi .h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    background: #006ab7;
}

.join-1info {
    width: 100%;
    overflow: hidden;
    line-height: 35px;
    font-size: 18px;
    color: #333;
    margin-top: 40px;
}

.join-1info p {
    margin-top: 30px;
}

.join-1info p:first-child {
    margin-top: 0px;
}

.join-2 {
    width: 81.25%;
    overflow: hidden;
    margin: 80px auto 0px;
}

.join-2content {
    width: 100%;
    overflow: hidden;
    margin-top: 56px;
}

.join-2item {
    width: 100%;
    overflow: hidden;
    margin-top: 40px;
}

.join-2item a {
    width: 100%;
    display: block;
    overflow: hidden;
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.join-2left {
    width: 27.81%;
    overflow: hidden;
    border-radius: 6px;
}

.join-2left img {
    width: 100%;
    height: auto;
    overflow: hidden;
}

.join-2item:hover img {
    transform: scale(1.03);
}

.join-2right {
    width: 67%;
    overflow: hidden;
}

.join-2right span {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 32px;
    color: #222;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.join-2right p {
    float: left;
    width: 100%;
    overflow: hidden;
    line-height: 26px;
    font-size: 16px;
    color: #666;
    margin-top: 18px;
}

.join-2right em {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 18px;
    color: #006ab7;
    font-family: "dinreg";
    margin-top: 3vw;
}

.join-2item:hover .join-2right span {
    color: #006ab7;
}

.join-boshi .news-page {
    margin-top: 140px;
}

/*about-join-zhaoxian*/
.zx {
    width: 100%;
    overflow: hidden;
    padding: 90px 0px 130px;
}

.zx .h3 {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 42px;
    font-weight: bold;
    color: #333;
    position: relative;
    padding-bottom: 20px;
}

.zx .h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    background: #006ab7;
}

.zx-nav {
    width: 100%;
    overflow: hidden;
    text-align: center;
    margin-top: 60px;
}

.zx-nav span {
    width: 210px;
    height: 60px;
    line-height: 60px;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    margin: 0px 18px;
    text-align: center;
    box-sizing: border-box;
    border: 1px #006ab7 solid;
}

.zx-nav span a {
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: block;
    font-size: 16px;
    color: #666;
    text-align: center;
}

.zx-nav span.active,
.zx-nav span:hover {
    background: #006ab7;
}

.zx-nav span.active a,
.zx-nav span:hover a {
    color: #fff;
}

.zx-1 {
    width: 72%;
    margin: 60px auto 0px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.zx-1item {
    width: 48.7%;
    overflow: hidden;
    background: #fff;
    height: 70px;
    line-height: 70px;
    box-sizing: border-box;
    box-shadow: 0px 0px 12px 4px rgba(0, 0, 0, 0.03);
    position: relative;
}

.zx-1item:nth-child(1):before {
    width: 26px;
    height: 100%;
    content: "";
    position: absolute;
    left: 30px;
    top: 0px;
    background: url("../images/icon-76.png") no-repeat center;
}

.zx-1item:nth-child(2):before {
    width: 26px;
    height: 100%;
    content: "";
    position: absolute;
    left: 30px;
    top: 0px;
    background: url("../images/icon-77.png") no-repeat center;
}

.zx-1item:after {
    width: 18px;
    height: 100%;
    overflow: hidden;
    content: "";
    position: absolute;
    right: 40px;
    top: 0px;
    background: url("../images/icon-78.png") no-repeat center;
}

.zx-1item select {
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: #fff;
    padding: 0px;
    margin: 0px;
    box-sizing: border-box;
    padding: 0px 74px;
    font-size: 18px;
    color: #666;
}

.zx-2 {
    width: 72%;
    margin: 10px auto 0px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.zx-2item {
    width: 48.7%;
    overflow: hidden;
    background: #fff;
    box-shadow: 0px 0px 12px 4px rgba(0, 0, 0, 0.03);
    margin-top: 25px;
}

.zx-2item a {
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: block;
    box-sizing: border-box;
    padding: 15px !important;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.zx-2left {
    width: calc(100% - 100px);
    overflow: hidden;
}

.zx-2left span {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 20px;
    color: #222;
}

.zx-2left em {
    float: left;
    width: auto;
    overflow: hidden;
    font-size: 16px;
    color: #006ab7;
    padding-right: 15px;
    position: relative;
    line-height: 24px;
    margin-top: 15px !important;
}

.zx-2left em:before {
    width: 15px;
    height: 100%;
    content: "";
    position: absolute;
    right: 0px;
    top: 0px;
    background: url("../images/icon-80.png") no-repeat right center;
}

.zx-2left em:after {
    width: 15px;
    height: 100%;
    content: "";
    position: absolute;
    right: 0px;
    top: 0px;
    background: url("../images/icon-81.png") no-repeat right center;
    opacity: 0;
}

.zx-2right {
    width: 60px;
    height: 100%;
    overflow: hidden;
    position: relative;
}

.zx-2right img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 60%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.zx-2right img:last-child {
    opacity: 0;
}

.zx-2item:hover {
    background: #006ab7;
    box-shadow: 0px 0px 12px 4px rgba(198, 38, 48, 0.1);
}

.zx-2item:hover span,
.zx-2item:hover em {
    color: #fff;
}

.zx-2item:hover .zx-2left em:before {
    opacity: 0;
}

.zx-2item:hover .zx-2left em:after {
    opacity: 1;
}

.zx-2item:hover .zx-2right img {
    opacity: 0;
}

.zx-2item:hover .zx-2right img:last-child {
    opacity: 1;
}

.zx .news-page {
    margin-top: 130px;
}

/*about-join-zhaoxian-detail*/
.zx-detail {
    width: 75%;
    overflow: hidden;
    margin: 0px auto;
    padding: 80px 0px 100px;
}

.zp-1 {
    width: 100%;
    overflow: hidden;
    background: url("../images/bg-2.png") no-repeat;
    background-size: cover;
    height: 16.66vw;
    position: relative;
}

.zp-1ver {
    width: 90%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 12;
    color: #fff;
}

.zp-1ver span {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 48px;
}

.zp-1ver em {
    float: left;
    width: auto;
    overflow: hidden;
    font-size: 16px;
    margin-top: 3vw;
    margin-right: 90px;
}

.zp-1ver p {
    float: left;
    width: auto;
    overflow: hidden;
    font-size: 16px;
    margin-top: 3vw;
}

.zp-2 {
    width: 100%;
    overflow: hidden;
    margin-top: 45px;
}

.zp-2info {
    width: 100%;
    overflow: hidden;
    font-size: 16px;
    color: #006ab7;
}

.zp-2item {
    width: 100%;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.zp-2item .txt2 {
    width: 32%;
    overflow: hidden;
    height: 60px;
    line-height: 60px;
    box-sizing: border-box;
    padding: 0px 40px;
    border: 1px #e3e3e3 solid;
    margin-top: 28px;
    font-size: 16px;
    color: #666;
}

.zp-2item .txt2::placeholder {
    color: #666 !important;
    opacity: 1;
}

.zp-2item .txt2::-webkit-input-placeholder {
    color: #666 !important;
    opacity: 1;
}

.zp-2item .txt2::-ms-input-placeholder {
    color: #666 !important;
    opacity: 1;
}

.zp-2item .txt2::-moz-placeholder {
    color: #666 !important;
    opacity: 1;
}

.zp-2item select {
    width: 32%;
    overflow: hidden;
    height: 60px;
    line-height: 60px;
    box-sizing: border-box;
    padding: 0px 40px;
    border: 1px #e3e3e3 solid;
    margin-top: 28px;
    font-size: 16px;
    color: #666;
    background: url("../images/icon-78.png") no-repeat 94% center;
}

.zp-2item .txt3 {
    width: 49%;
    overflow: hidden;
    height: 60px;
    line-height: 60px;
    box-sizing: border-box;
    padding: 0px 40px;
    border: 1px #e3e3e3 solid;
    margin-top: 28px;
    font-size: 16px;
    color: #666;
}

.zp-2item .txt3::placeholder {
    color: #666 !important;
    opacity: 1;
}

.zp-2item .txt3::-webkit-input-placeholder {
    color: #666 !important;
    opacity: 1;
}

.zp-2item .txt3::-ms-input-placeholder {
    color: #666 !important;
    opacity: 1;
}

.zp-2item .txt3::-moz-placeholder {
    color: #666 !important;
    opacity: 1;
}

.zp-3 {
    width: 100%;
    overflow: hidden;
    margin-top: 70px;
    border-bottom: 1px #e6e6e6 solid;
    padding-bottom: 60px;
}

.zp-3 h3 {
    width: 100%;
    overflow: hidden;
    font-size: 24px;
    color: #333;
    margin-bottom: 18px;
}

.zp-3 p {
    width: 100%;
    overflow: hidden;
    line-height: 32px;
    font-size: 16px;
    color: #808080;
}

.zp-4 {
    width: 100%;
    overflow: hidden;
    margin-top: 45px;
}

.zp-4 h3 {
    width: 100%;
    overflow: hidden;
    font-size: 24px;
    color: #333;
    margin-bottom: 18px;
}

.zp-4 p {
    width: 100%;
    overflow: hidden;
    line-height: 32px;
    font-size: 16px;
    color: #808080;
}

.zp-2des {
    width: 100%;
    overflow: hidden;
    font-size: 16px;
    color: #006ab7;
    margin-top: 150px;
}

.zp-5 {
    width: 100%;
    overflow: hidden;
    margin-top: 70px;
}

.zp-5 input {
    width: 100%;
    height: 60px;
    line-height: 60px;
    overflow: hidden;
    text-align: center;
    background: #006ab7;
    font-size: 18px;
    color: #fff;
    cursor: pointer;
}

.zp-5:hover input {
    background: #b0121c;
}

/*solve*/
.solve-nav {
    width: 100%;
    overflow: hidden;
    height: 140px;
    background: #2754a7;
}

.solve-nav ul {
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: flex;
}

.solve-nav ul li {
    flex: 1;
    height: 100%;
    overflow: hidden;
}

.solve-nav ul li:nth-child(2n+1) {
    background: #335ca8;
}

.solve-nav ul li.active,
.solve-nav ul li:hover {
    background: #00aacb !important;
}

.solve-nav ul li a {
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: block;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-content: center;
    position: relative;
    z-index: 12;
}

.solve-nav ul li samp {
    width: 100%;
    height: 50px;
    display: block;
    position: relative;
    overflow: hidden;
}

.solve-nav ul li samp img {
    width: auto;
    height: auto;
    max-height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.solve-nav ul li span {
    width: 100%;
    display: block;
    overflow: hidden;
    text-align: center;
    font-size: 18px;
    color: #fff;
    margin-top: 15px;
}

.solve-nav ul li:hover samp img {
    transform: translate(-50%, -50%) rotateY(180deg);
}

.solve {
    width: 100%;
    overflow: hidden;
}

.solve-1 {
    width: 81.25%;
    overflow: hidden;
    margin: 130px auto 0px;
}

.solve-1 .h3 {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 42px;
    font-weight: bold;
    color: #333;
    position: relative;
    padding-bottom: 20px;
}

.solve-1 .h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    background: #006ab7;
}

.solve-1info {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 16px;
    color: #222;
    line-height: 26px;
    margin-top: 35px;
    text-align: left;
    text-indent: 2em;
}

.solve-2 {
    width: 81.25%;
    margin: 125px auto 0px;
    padding-bottom: 120px;
}

.solve-2 .h3 {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 42px;
    font-weight: bold;
    color: #333;
    position: relative;
    padding-bottom: 20px;
}

.solve-2 .h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    background: #006ab7;
}

.solve-2content {
    width: 100%;
    margin-top: 10px;
}

.solve-2item {
    width: 100%;
    overflow: hidden;
    background: #fff;
    margin-top: 40px;
    position: relative;
    box-shadow: 0px 0px 13px 3px rgba(204, 204, 204, 0.3);
    border-radius: 6px;
}

.solve-2item a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    position: relative;
}

.solve-2left {
    float: left;
    width: 50.57%;
    overflow: hidden;
}

.solve-2left img {
    width: 100%;
    height: auto;
}

.solve-2item:hover .solve-2left img {
    transform: scale(1.03);
}

.solve-2right {
    width: 49.43%;
    overflow: hidden;
    position: absolute;
    right: 0px;
    top: 0px;
    height: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-content: center;
}

.solve-2right span {
    width: 82%;
    display: block;
    overflow: hidden;
    font-size: 30px;
    color: #000;
    margin: 0px auto;
}

.solve-2info {
    width: 82%;
    overflow: hidden;
    line-height: 26px;
    font-size: 16px;
    color: #666;
    margin: 20px auto 0px;
}

.solve-2more {
    width: 82%;
    margin: 40px auto 0px;
}

.solve-2more em {
    float: left;
    width: 146px;
    height: 48px;
    line-height: 48px;
    overflow: hidden;
    border: 1px #006ab7 solid;
    border-radius: 2px;
    box-sizing: border-box;
    padding-left: 18px;
    font-size: 14pxs;
    color: #333;
    position: relative;
}

.solve-2more em:before {
    width: 26px;
    height: 100%;
    content: "";
    position: absolute;
    right: 0px;
    top: 0px;
    background: url("../images/icon-93.png") no-repeat left center;
}

.solve-2more em:after {
    width: 26px;
    height: 100%;
    content: "";
    position: absolute;
    right: 0px;
    top: 0px;
    background: url("../images/icon-93-1.png") no-repeat left center;
    opacity: 0;
}

.solve-2more em:hover {
    background: #006ab7;
    color: #fff;
}

.solve-2more em:hover:before {
    opacity: 0;
}

.solve-2more em:hover:after {
    opacity: 1;
}

.solve-2item:nth-child(2n) .solve-2left {
    float: right;
}

.solve-2item:nth-child(2n) .solve-2right {
    right: auto;
    left: 0px;
}

.solve-3 {
    width: 100%;
    margin: 0px auto;
    padding: 97px 0px 117px;
    background: #f7f7f7;
}

.solve-3 .h3 {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 42px;
    font-weight: bold;
    color: #333;
    position: relative;
    padding-bottom: 20px;
}

.solve-3 .h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    background: #006ab7;
}

.solve-3content {
    width: 81.25%;
    margin: 50px auto 0px;
    position: relative;
}

.solve-3content .swiper-container {
    padding-bottom: 5px;
}

.solve-3content .swiper-slide {
    background: #fff;
}

.solve-3content .swiper-slide a {
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: block;
}

.solve-3content .swiper-slide samp {
    width: 100%;
    overflow: hidden;
    display: block;
    height: 16.4vw;
    position: relative;
}

.solve-3content .swiper-slide samp img {
    width: auto;
    height: auto;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    max-width: 70%;
    max-height: 70%;
}

.solve-3content .swiper-slide span {
    width: 100%;
    display: block;
    overflow: hidden;
    height: 72px;
    line-height: 72px;
    text-align: center;
    background: #006ab7;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    font-size: 20px;
    color: #fff;
}

.solve-3content .swiper-slide:hover {
    transform: translateY(5px);
}

.solve-3content .swiper-button-prev {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    overflow: hidden;
    background: #e5e5e5 url("../images/icon-59.png") no-repeat center;
    left: -80px;
}

.solve-3content .swiper-button-next {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    overflow: hidden;
    background: #e5e5e5 url("../images/icon-59.png") no-repeat center;
    right: -80px;
    transform: rotate(180deg);
}

.solve-3content .swiper-button-prev:hover,
.solve-3content .swiper-button-next:hover {
    background-color: #006ab7;
}

.solve-3content .swiper-slide:hover samp img {
    transform: translate(-50%, -50%) scale(1.02);
}

/*solve-detail*/
.bread-crumb {
    width: 100%;
    overflow: hidden;
    margin-top: 100px;
    position: relative;
    height: 76px;
    line-height: 76px;
    border-bottom: 1px #f0f0f0 solid;
}

.bread-crumb:before {
    width: 100%;
    height: 0px;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    box-shadow: 0px 0px 20px 10px rgba(209, 209, 209, 0.3);
}

.bread-center {
    width: 75%;
    overflow: hidden;
    position: relative;
    margin: 0px auto;
    height: 100%;
    color: #666;
    font-size: 16px;
}

.bread-center a {
    color: #666;
    margin: 0px 14px;
}

.bread-center a:hover {
    color: #006ab7;
}

.bread-center a:first-child {
    margin-left: 0px;
}

.bread-center a.home {
    padding-left: 24px;
    position: relative;
}

.bread-center a.home:before {
    width: 10px;
    height: 10px;
    content: "";
    position: absolute;
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    box-sizing: border-box;
    border: 2px #006ab7 solid;
    border-radius: 50%;
}

.solve-4 {
    width: 75%;
    overflow: hidden;
    margin: 64px auto 0px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.solve-4left {
    width: 46.24%;
    overflow: hidden;
}

.solve-4left img {
    width: 100%;
    height: auto;
}

.solve-4left:hover img {
    transform: scale(1.03);
}

.solve-4right {
    width: 49.2%;
}

.solve-4right .h3 {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 40px;
    color: #222;
}

.solve-4info {
    float: left;
    width: 100%;
    overflow: hidden;
    line-height: 28px;
    font-size: 16px;
    color: #666;
    margin-top: 1.8vw;
}

.solve-4right em {
    float: left;
    width: 150px;
    height: 44px;
    line-height: 44px;
    overflow: hidden;
    background: #006ab7;
    margin-top: 2.5vw;
}

.solve-4right em a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    text-align: center;
    font-size: 14px;
    color: #fff;
}

.solve-4right em:hover {
    transform: translateY(3px);
}

.solve-5 {
    width: 100%;
    overflow: hidden;
    margin-top: 60px;
}

.solve-5 ul {
    width: 75%;
    margin: 0px auto;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
}

.solve-5 ul li {
    float: left;
    width: 32%;
    overflow: hidden;
    margin-right: 2%;
    margin-top: 20px;
    box-sizing: border-box;
    border: 1px #006ab7 solid;
    line-height: 26px;
}

.solve-5 ul li:nth-child(3n) {
    margin-right: 0px;
}

.solve-5 ul li a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    font-size: 18px;
    color: #666;
    text-align: center;
    box-sizing: border-box;
    padding: 15px 10px;
}

.solve-5 ul li.active,
.solve-5 ul li:hover {
    background: #006ab7;
}

.solve-5 ul li.active a,
.solve-5 ul li:hover a {
    color: #fff;
}

.solve-6 {
    width: 100%;
    overflow: hidden;
    height: 70px;
    background: #f2f2f2;
    margin-top: 72px;
}

.solve-6 ul {
    width: 75%;
    overflow: hidden;
    margin: 9px auto 0px;
    height: 61px;
    line-height: 61px;
}

.solve-6 ul li {
    float: left;
    width: 25%;
    overflow: hidden;
    height: 100%;
    text-align: center;
    font-size: 18px;
    color: #666;
    cursor: pointer;
    position: relative;
}

.solve-6 ul li:before {
    width: 0%;
    height: 2px;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: #006ab7;
}

.solve-6 ul li.active {
    background: #fff;
    color: #006ab7;
}

.solve-6 ul li.active:before {
    width: 100%;
}

.solve-6 ul li:hover {
    color: #006ab7;
}

.solve-7 {
    width: 100%;
    overflow: hidden;
    margin-top: 38px;
    padding-bottom: 40px;
}

.solve-7pannel {
    width: 75%;
    overflow: hidden;
    margin: 0px auto;
    padding: 80px 0px 60px;
    border-bottom: 1px #d1d1d1 solid;
}

.solve-7pannel:last-child {
    border: none;
}

.solve-7pannel .h4 {
    width: 100%;
    overflow: hidden;
    font-size: 24px;
    color: #006ab7;
}

.solve-7content {
    width: 100%;
    overflow: hidden;
    line-height: 26px;
    font-size: 16px;
    color: #666;
    margin-top: 30px;
}

.solve-7content img {
    width: auto;
    height: auto;
    max-width: 100%;
}

.solve-7pannel ul {
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    box-sizing: border-box;
    padding: 0px 10px;
    margin-top: 30px;
}

.solve-7pannel ul li {
    width: 100% !important;
    overflow: hidden;
    background: #fff;
    margin-top: 25px;
    box-shadow: 0px 0px 12px 4px rgba(0, 0, 0, 0.02);
    height: 60px;
    line-height: 60px;
    display: block;
    overflow: hidden;
    box-sizing: border-box;
    padding: 0px 40px;
}

.solve-7pannel ul li span {
    float: left;
    width: 85%;
    height: 100%;
    overflow: hidden;
    box-sizing: border-box;
    padding-left: 40px;
    background: url("../images/icon-94.png") no-repeat left center;
    font-size: 20px;
    color: #353535;
}

.solve-7pannel ul li span a {
    color: #353535;
}

.solve-7pannel ul li em {
    float: right;
    width: 21px;
    height: 100%;
    overflow: hidden;
    background: url("../images/icon-95.png") no-repeat center;
}

.solve-7pannel ul li:hover {
    box-shadow: 0px 0px 12px 4px rgba(0, 0, 0, 0.06);
}

.solve-7pannel ul li:hover span a {
    color: #006ab7;
}

.solve-7pannel ul li:hover em {
    transform: translateY(3px);
}

/*product*/
.product {
    width: 81.25%;
    margin: 0px auto;
    padding: 50px 0px 126px;
}

.pro-left {
    float: left;
    width: calc(290px + 2vw);
    box-sizing: border-box;
    position: sticky;
    top: calc(100px + 20px);
    max-height: 80vh;
}

.pro-center {
    float: left;
    width: 290px;
    box-sizing: border-box;
    position: relative;
}

.pro-center:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    border: 1px #e6e6e6 solid;
    box-sizing: border-box;
}

.pro-pannel {
    width: 100%;
    overflow: hidden;
    position: relative;
    z-index: 12;
}

.pro-pannel:before {
    width: 100%;
    height: 1px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: #e6e6e6;
}

.pro-title {
    width: 100%;
    overflow: hidden;
    height: 70px;
    line-height: 70px;
    cursor: pointer;
}

.pro-title a {
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: flex;
    box-sizing: border-box;
    padding: 0px 30px 0px 20px;
    justify-content: space-between;
    align-items: center;
}

.pro-title span {
    width: 90%;
    display: block;
    overflow: hidden;
    box-sizing: border-box;
    font-size: 16px !important;
    color: #222;
    position: relative;
    padding-left: 28px;
    line-height: 22px;
}

.pro-title span:before {
    width: 10px;
    height: 10px;
    content: "";
    position: absolute;
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 50%;
    border: 2px #006ab7 solid;
}

.pro-title em {
    width: 12px;
    height: 12px;
    display: block;
    position: relative;
}

.pro-title em:before {
    width: 100%;
    height: 2px;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: #006ab7;
}

.pro-title em:after {
    width: 2px;
    height: 100%;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: #006ab7;
}

.pro-pannel.active .pro-title {
    background: #006ab7;
    cursor: default;
}

.pro-pannel.active .pro-title span {
    color: #fff;
}

.pro-pannel.active .pro-title span:before {
    border-color: #fff;
}

.pro-pannel.active .pro-title em:after {
    opacity: 0;
}

.pro-pannel.active .pro-title em:before {
    background: #fff;
}

.pro-cont {
    width: 100%;
    overflow: hidden;
    display: none;
    box-sizing: border-box;
    padding: 20px;
}

.pro-model {
    width: 100%;
    overflow: hidden;
}

.pro-item {
    width: 100%;
    overflow: hidden;
    height: 32px;
    line-height: 32px;
    cursor: pointer;
}

.pro-item span {
    float: left;
    width: calc(100% - 20px);
    overflow: hidden;
    height: 100%;
    font-size: 15px !important;
    color: #333;
    font-weight: bold;
}

.pro-item em {
    width: 12px;
    height: 100%;
    float: right;
    overflow: hidden;
    position: relative;
}

.pro-item em:before {
    width: 12px;
    height: 2px;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: #006ab7;
}

.pro-item em:after {
    width: 2px;
    height: 12px;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: #006ab7;
}

.pro-model.active .pro-item span {
    color: #006ab7;
}

.pro-model.active .pro-item em:after {
    opacity: 0;
}

.pro-model ul {
    width: 100%;
    overflow: hidden;
    margin: 10px 0px 15px;
    display: none;
}

.pro-model ul li {
    float: left;
    width: 100%;
    overflow: hidden;
    line-height: 26px;
    padding-left: 13px;
    font-size: 14px;
    color: #666;
    position: relative;
    cursor: pointer;
}

.pro-model ul li a {
    color: #666;
}

.pro-model ul li:before {
    width: 4px;
    height: 4px;
    content: "";
    position: absolute;
    left: 0px;
    top: 12px;
    border-radius: 50%;
    background: #006ab7;
}

.pro-model ul li.on a,
.pro-model ul li:hover a {
    color: #006ab7;
}

.pro-right {
    float: right;
    width: calc(100% - 370px);
    overflow: hidden;
}

.pro-form {
    width: 40%;
    overflow: hidden;
    height: 50px;
    line-height: 50px;
    box-sizing: border-box;
    background: #f7f7f7;
    border: 1px #dbdbdb solid;
}

.pro-form form {
    width: 100%;
    height: 100%;
    overflow: hidden;
    box-sizing: border-box;
    padding: 0px 20px;
}

.pro-form .txt3 {
    float: left;
    width: 80%;
    overflow: hidden;
    height: 100%;
    background: none;
    font-size: 16px;
    color: #666;
}

.pro-form .txt3::placeholder {
    color: #666 !important;
    opacity: 1;
}

.pro-form .txt3::-webkit-input-placeholder {
    color: #666 !important;
    opacity: 1;
}

.pro-form .txt3::-ms-input-placeholder {
    color: #666 !important;
    opacity: 1;
}

.pro-form .txt3::-moz-placeholder {
    color: #666 !important;
    opacity: 1;
}

.pro-form .bt3 {
    float: right;
    width: 18px;
    height: 100%;
    overflow: hidden;
    background: url("../images/icon-2-1.png") no-repeat center;
    cursor: pointer;
}

.pro-content {
    width: 100%;
    overflow: hidden;
}

.pro-pannel2 {
    width: 100%;
    overflow: hidden;
    display: none;
}

.pro-pannel2.active {
    display: block;
}

.pro-model2 {
    width: 100%;
    overflow: hidden;
    margin-top: 0px !important;
    display: none;
}

.pro-model2.on {
    display: block;
}

.pro-name {
    width: 100%;
    overflow: hidden;
    position: relative;
    font-size: 34px;
    color: #222;
    font-weight: bold;
    padding-bottom: 20px;
}

.pro-name:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: #006ab7;
}

.pro-list {
    width: 100%;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    margin-top: -10px;
}

.pro-li {
    float: left;
    width: 32%;
    overflow: hidden;
    background: #f7f7f7;
    margin: 50px 2% 0px 0px;
}

.pro-li:nth-child(3n) {
    margin-right: 0px;
}

.pro-li a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
}

.pro-li samp {
    width: 100%;
    display: block;
    overflow: hidden;
    height: 16vw;
    box-sizing: border-box;
    border: 1px #f0f0f0 solid;
    background: #fff;
    position: relative;
}

.pro-li samp img {
    width: auto;
    height: auto;
    max-width: 98%;
    max-height: 98%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.pro-li p {
    width: 100%;
    height: 70px;
    display: block;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
    padding: 0px 10px;
}

.pro-li p span {
    width: 100%;
    overflow: hidden;
    display: block;
    text-align: center;
    font-size: 16px;
    color: #333;
    line-height: 20px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.pro-li:hover p {
    background: #006ab7;
}

.pro-li:hover p span {
    color: #fff;
}

.pro-li:hover samp img {
    transform: translate(-50%, -50%) scale(1.03);
}

.pro-left .mCSB_scrollTools {
    width: 6px !important;
    background: #f5f5f5;
    opacity: 1 !important;
    border: none !important;
}

.pro-left .mCSB_scrollTools .mCSB_draggerRail {
    display: none !important;
}

.pro-left .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 100% !important;
    background: #006ab7;
    border-radius: 0px;
}

.pro-left .mCSB_scrollTools .mCSB_draggerContainer {
    width: 6px !important;
}

/*product-info*/
.pro-1 {
    width: 100%;
    overflow: hidden;
    padding: 90px 0px;
}

.pro-1center {
    width: 75%;
    margin: 0px auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    flex-direction: row-reverse;
}

.pro-1left {
    width: 45.5%;
    float: left;
}

.pro-1left .h3 {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 42px;
    color: #222;
}

.pro-1info {
    float: left;
    width: 100%;
    overflow: hidden;
    line-height: 28px;
    font-size: 16px;
    color: #666;
    margin-top: 30px;
}

.pro-1img {
    float: left;
    width: 100%;
    overflow: hidden;
    margin-top: 30px;
}

.pro-1img img {
    max-width: 100%;
}

.pro-1more {
    float: left;
    width: 100%;
    margin-top: 60px;
}

.pro-1more a {
    float: left;
    height: 44px;
    line-height: 44px;
    margin-right: 30px;
    padding: 0 40px;
    border: 1px #006ab7 solid;
    font-size: 14px;
    background: #006ab7;
    color: #fff;
}

.pro-1more a:hover {
    transform: translateY(-3px);
}

.pro-1right {
    width: 46%;
}

.pro-1cont {
    float: left;
    width: 83.5%;
    overflow: hidden;
    height: 17vw;
}

.pro-1cont .swiper-slide {
    position: relative;
}

.pro-1cont .swiper-slide img {
    width: auto;
    height: auto;
    max-width: 80%;
    max-height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.pro-1nav {
    float: right;
    width: 15.234%;
    height: 17vw;
    position: relative;
}

.pro-1nav .swiper-slide {
    box-sizing: border-box;
    border: 3px #f2f2f2 solid;
    position: relative;
    cursor: pointer;
}

.pro-1nav .swiper-slide img {
    width: auto;
    height: auto;
    max-width: 70%;
    max-height: 70%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.pro-1nav .swiper-slide.active {
    border-color: #006ab7;
}

.pro-1nav .swiper-button-prev {
    width: 100%;
    height: 40px;
    background: #f7f7f7 url("../images/icon-24.png") no-repeat center;
    left: 0px;
    margin: 0px;
    top: -50px;
}

.pro-1nav .swiper-button-next {
    width: 100%;
    height: 40px;
    background: #f7f7f7 url("../images/icon-24.png") no-repeat center;
    right: 0px;
    margin: 0px;
    top: auto;
    bottom: -50px;
    transform: rotate(180deg);
}

.pro-1nav .swiper-button-prev:hover,
.pro-1nav .swiper-button-next:hover {
    background-color: #ddd;
}

.pro-2 {
    width: 100%;
    overflow: hidden;
    height: 70px;
    background: #f2f2f2;
    margin-top: 72px;
}

.pro-2 ul {
    width: 75%;
    overflow: hidden;
    margin: 9px auto 0px;
    height: 61px;
    line-height: 61px;
}

.pro-2 ul li {
    float: left;
    width: 25%;
    overflow: hidden;
    height: 100%;
    text-align: center;
    font-size: 18px;
    color: #666;
    cursor: pointer;
    position: relative;
}

.pro-2 ul li:before {
    width: 0%;
    height: 2px;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: #006ab7;
}

.pro-2 ul li.active {
    background: #fff;
    color: #006ab7;
}

.pro-2 ul li.active:before {
    width: 100%;
}

.pro-3 {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.pro-3pannel {
    width: 100%;
    overflow: hidden;
    position: absolute;
    left: 0px;
    top: 0px;
    opacity: 0;
    z-index: 1;
}

.pro-3pannel.active {
    opacity: 1;
    z-index: 2;
    position: relative;
}

.pro-3td {
    width: 75%;
    overflow: hidden;
    margin: 0px auto;
    padding: 90px 0px 160px;
    opacity: 0;
    transform: translateY(60px);
    font-size: 16px;
    line-height: 28px;
}

.pro-3td .h4 {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 24px;
    color: #006ab7;
}

.pro-3info {
    float: left;
    width: 100%;
    overflow: hidden;
    line-height: 28px;
    font-size: 16px;
    color: #666;
    margin-top: 20px;
}

.pro-3pic {
    float: left;
    width: 100%;
    overflow: hidden;
    margin-top: 20px;
}

.pro-3pic img {
    width: 100%;
    height: auto;
}

.pro-3pannel ul {
    float: left;
    width: 100%;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    margin-top: 25px;
}

.pro-3pannel ul li {
    float: left;
    width: 100% !important;
    overflow: hidden;
    line-height: 24px;
    position: relative;
    font-size: 16px;
    color: #222;
    padding-left: 24px;
    margin-top: 20px;
    box-sizing: border-box;
}

.pro-3pannel ul li:before {
    width: 6px;
    height: 6px;
    content: "";
    position: absolute;
    left: 0px;
    top: 10px;
    border-radius: 50%;
    background: #006ab7;
    overflow: hidden;
}

.pro-3des {
    float: left;
    width: 100%;
    overflow: hidden;
    line-height: 28px;
    font-size: 16px;
    color: #666;
    margin-top: 50px;
}

.pro-3pannel ul.on li {
    width: 32%;
    margin-right: 1%;
}

.pro-3pannel.active .pro-3td {
    animation: updown 0.5s ease 1;
    animation-fill-mode: forwards;
}

.pro-3app {
    width: 75%;
    padding: 90px 0px 160px;
    margin: 0px auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.pro-3left {
    width: 45.5%;
    overflow: hidden;
    box-sizing: border-box;
}

.pro-3left .swiper-button-prev,
.pro-3left .swiper-button-next {
    display: none;
}

.pro-3model {
    width: 100%;
    overflow: hidden;
}

.pro-3model samp {
    display: none;
}

.pro-3model span {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 24px;
    color: #006ab7;
    opacity: 0;
    transform: translateY(60px);
}

.pro-3model em {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 14px;
    color: #999;
    opacity: 0;
    transform: translateY(60px);
}

.pro-3ct {
    float: left;
    width: 100%;
    overflow: hidden;
    line-height: 28px;
    font-size: 16px;
    color: #666;
    margin-top: 60px;
    opacity: 0;
    transform: translateY(60px);
}

.pro-3left .swiper-slide-active .pro-3model span {
    animation: updown 0.5s ease 1;
    animation-fill-mode: forwards;
}

.pro-3left .swiper-slide-active .pro-3model em {
    animation: updown 0.5s ease 0.1s 1;
    animation-fill-mode: forwards;
}

.pro-3left .swiper-slide-active .pro-3ct {
    animation: updown 0.5s ease 0.2s 1;
    animation-fill-mode: forwards;
}

.pro-3right {
    width: 46%;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
}

.pro-3cir {
    width: 83.5%;
    display: flex;
    align-items: center;
    box-sizing: border-box;
}

.pro-3cir span {
    width: 100%;
    text-align: center;
    display: none;
}

.pro-3cir span img {
    max-width: 80%;
}

.pro-3cir span.active {
    display: block;
}

.pro-3loop {
    width: 15.234%;
    box-sizing: border-box;
}

.pro-3small {
    height: 96px;
    margin-bottom: 20px;
    border: 3px #f2f2f2 solid;
    cursor: pointer;
    position: relative;
}

.pro-3small img {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 70%;
    max-height: 70%;
}

.pro-3small.active {
    border: 3px #006ab7 solid;
}

.pro-3pannel.active .pro-3app {
    animation: updown 0.5s ease 1;
    animation-fill-mode: forwards;
}

.pro-3rel {
    width: 75%;
    margin: 160px auto;
    position: relative;
    opacity: 0;
    transform: translateY(60px);
}

.pro-3rel .swiper-slide {
    box-sizing: border-box;
    padding: 0px 2.4vw;
}

.pro-3rel a {
    width: 100%;
    display: block;
    overflow: hidden;
    height: 100%;
}

.pro-3rel samp {
    width: 100%;
    display: block;
    overflow: hidden;
    height: 13.54vw;
    position: relative;
}

.pro-3rel samp img {
    width: auto;
    height: auto;
    max-width: 90%;
    max-height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.pro-3rel span {
    width: 100%;
    display: block;
    overflow: hidden;
    margin-top: 40px;
    line-height: 28px;
    font-size: 18px;
    color: #222;
    text-align: center;
}

.pro-3rel .swiper-slide:hover span {
    color: #006ab7;
    transform: translateY(4px);
}

.pro-3rel .swiper-button-prev {
    width: 50px;
    height: 50px;
    overflow: hidden;
    border-radius: 50%;
    background: #e5e5e5 url("../images/icon-59.png") no-repeat center;
    left: -80px;
}

.pro-3rel .swiper-button-next {
    width: 50px;
    height: 50px;
    overflow: hidden;
    border-radius: 50%;
    background: #e5e5e5 url("../images/icon-59.png") no-repeat center;
    right: -80px;
    transform: rotate(180deg);
}

.pro-3rel .swiper-button-prev:hover,
.pro-3rel .swiper-button-next:hover {
    background-color: #006ab7;
}

.pro-3pannel.active .pro-3rel {
    animation: updown 0.5s ease 1;
    animation-fill-mode: forwards;
}

.pro-3video {
    width: 75%;
    margin: 0 auto;
    padding: 90px 0 0;
    position: relative;
    opacity: 0;
    transform: translateY(60px);
}

.pro-3item {
    width: 100%;
    overflow: hidden;
    padding-bottom: 40px;
    cursor: pointer;
}

.pro-3item samp {
    width: 100%;
    height: 14.58vw;
    display: block;
    overflow: hidden;
    position: relative;
    border-radius: 8px;
}

.pro-3item samp em {
    width: 3.9vw;
    height: 3.9vw;
    overflow: hidden;
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: url("../images/icon-42.png") no-repeat center;
    background-size: 100%;
    opacity: 0.7;
}

.pro-3item samp img {
    width: 100%;
    height: 100%;
    overflow: hidden;
    object-fit: cover;
}

.pro-3item:hover samp img {
    transform: scale(1.03);
}

.pro-3item span {
    width: 100%;
    overflow: hidden;
    font-size: 20px;
    color: #222;
    margin-top: 50px;
    display: block;
    text-align: center;
}

.pro-3item p {
    width: 100%;
    overflow: hidden;
    font-size: 20px;
    color: #222;
    margin-top: 8px;
    display: block;
    text-align: center;
}

.pro-3item:hover samp em {
    opacity: 1;
}

.pro-3video .swiper-button-prev {
    width: 50px;
    height: 50px;
    overflow: hidden;
    border-radius: 50%;
    background: #e5e5e5 url("../images/icon-59.png") no-repeat center;
    left: -80px;
}

.pro-3video .swiper-button-next {
    width: 50px;
    height: 50px;
    overflow: hidden;
    border-radius: 50%;
    background: #e5e5e5 url("../images/icon-59.png") no-repeat center;
    right: -80px;
    transform: rotate(180deg);
}

.pro-3video .swiper-button-prev:hover,
.pro-3video .swiper-button-next:hover {
    background-color: #006ab7;
}

.pro-3pannel.active .pro-3video {
    animation: updown 0.5s ease 1;
    animation-fill-mode: forwards;
}

/*download*/
.down-1 {
    width: 100%;
    overflow: hidden;
    padding: 60px 0px;
}

.down-1 form {
    width: 1120px;
    overflow: hidden;
    margin: 0px auto;
    display: block;
    height: 50px;
    line-height: 50px;
    box-shadow: 0px 0px 12px 5px rgba(0, 0, 0, 0.03);
    box-sizing: border-box;
    padding: 0px 20px !important;
}

.down-1 .txt4 {
    float: left;
    width: 90%;
    overflow: hidden;
    height: 100%;
    font-size: 14px;
    color: #666;
}

.down-1 .txt4::placeholder {
    color: #666 !important;
    opacity: 1;
}

.down-1 .txt4::-webkit-input-placeholder {
    color: #666 !important;
    opacity: 1;
}

.down-1 .txt4::-ms-input-placeholder {
    color: #666 !important;
    opacity: 1;
}

.down-1 .txt4::-moz-placeholder {
    color: #666 !important;
    opacity: 1;
}

.down-1 .bt4 {
    float: right;
    width: 28px;
    overflow: hidden;
    height: 100%;
    background: url("../images/icon-107.png") no-repeat center;
    cursor: pointer;
}

.down-1cont {
    width: 1100px;
    overflow: hidden;
    margin: 10px auto 0px;
}

.down-1icon {
    float: left;
    width: 13%;
    overflow: hidden;
    height: 38px;
    line-height: 38px;
    border-radius: 20px;
    margin-right: 1.5%;
    box-sizing: border-box;
    border: 1px #006ab7 solid;
    margin-top: 20px;
}

.down-1icon:nth-child(7n) {
    margin-right: 0px;
}

.down-1icon a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}

.down-1icon samp {
    width: 26px;
    display: block;
    overflow: hidden;
    height: 100%;
    position: relative;
}

.down-1icon samp img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 90%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.down-1icon samp img:last-child {
    opacity: 0;
}

.down-1icon span {
    width: auto;
    font-size: 14px;
    color: #666;
    margin-left: 12px;
}

.down-1icon:hover {
    background: #006ab7;
}

.down-1icon:hover span {
    color: #fff;
}

.down-1icon:hover samp img {
    opacity: 0;
}

.down-1icon:hover samp img:last-child {
    opacity: 1;
}

.down-2 {
    width: 100%;
    overflow: hidden;
    background: #f7f7f7;
}

.down-2 .h3 {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 42px;
    font-weight: bold;
    color: #333;
    position: relative;
    padding-bottom: 20px;
    margin-top: 110px;
}

.down-2 .h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    background: #006ab7;
}

.down-2content {
    width: 81.25%;
    overflow: hidden;
    margin: 0px auto;
    padding-bottom: 10px;
    margin-top: 30px;
}

.down-2content ul {
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    box-sizing: border-box;
    padding: 0px 10px;
}

.down-2content ul li {
    width: 100%;
    overflow: hidden;
    background: #fff;
    margin-top: 25px;
    box-shadow: 0px 0px 12px 4px rgba(0, 0, 0, 0.02);
    height: 60px;
    line-height: 60px;
    box-sizing: border-box;
    padding: 0px 40px;
}

.down-2content ul li span {
    float: left;
    width: 90%;
    height: 100%;
    overflow: hidden;
    box-sizing: border-box;
    padding-left: 40px;
    background: url("../images/icon-94.png") no-repeat left center;
    font-size: 20px;
    color: #353535;
}

.down-2content ul li span a {
    color: #353535;
}

.down-2content ul li em {
    float: right;
    width: 21px;
    height: 100%;
    overflow: hidden;
    background: url("../images/icon-95.png") no-repeat center;
}

.down-2content ul li em a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
}

.down-2content ul li:hover {
    box-shadow: 0px 0px 12px 4px rgba(0, 0, 0, 0.06);
}

.down-2content ul li:hover span a {
    color: #006ab7;
}

.down-2content ul li:hover em {
    transform: translateY(3px);
}

.mCSB_scrollTools .mCSB_draggerContainer {
    background: #e0e2eb;
    width: 1px;
}

.mCSB_scrollTools .mCSB_draggerRail {
    display: none;
}

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background: #006ab7 !important;
    border-radius: 0px;
    width: 5px;
}

.down-3content {
    width: 81.25%;
    margin: 60px auto 0px;
    padding-bottom: 114px;
    position: relative;
}

.down-3content .swiper-slide {
    overflow: hidden;
    background: #fff;
    box-shadow: 0px 0px 12px 4px rgba(48, 64, 97, 0.1);
    cursor: pointer;
}

.down-3content .swiper-container {
    padding: 10px;
    transform: translateX(-10px);
}

.down-3item {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.down-3item samp {
    width: 100%;
    height: 14.84vw;
    overflow: hidden;
    position: relative;
    display: block;
}

.down-3item samp img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.down-3item:hover samp img {
    transform: scale(1.03);
}

.down-3item samp em {
    width: 3.9vw;
    height: 3.9vw;
    overflow: hidden;
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: url("../images/icon-42.png") no-repeat center;
    background-size: 100%;
    opacity: 0.7;
}

.down-3item:hover samp em {
    opacity: 1;
}

.down-3item span {
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    display: block;
    padding: 23px 10px;
    text-align: center;
    font-size: 24px;
    color: #333;
}

.down-3content .swiper-slide:hover {
    background: #006ab7;
}

.down-3item:hover span {
    color: #fff;
}

.down-3content .swiper-button-prev {
    width: 50px;
    height: 50px;
    overflow: hidden;
    border-radius: 50%;
    background: #e5e5e5 url("../images/icon-59.png") no-repeat center;
    left: -80px;
    margin-top: -70px;
}

.down-3content .swiper-button-next {
    width: 50px;
    height: 50px;
    overflow: hidden;
    border-radius: 50%;
    background: #e5e5e5 url("../images/icon-59.png") no-repeat center;
    right: -80px;
    transform: rotate(180deg);
    margin-top: -70px;
}

.down-3content .swiper-button-prev:hover,
.down-3content .swiper-button-next:hover {
    background-color: #006ab7;
}

.down-4 {
    width: 100%;
    overflow: hidden;
    padding: 120px 0px 170px;
}

.down-4 .h3 {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 42px;
    font-weight: bold;
    color: #333;
    position: relative;
    padding-bottom: 20px;
}

.down-4 .h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    background: #006ab7;
}

.down-4 form {
    width: 81.25%;
    overflow: hidden;
    margin: 20px auto 0px;
}

.down-4group {
    width: 100%;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.down-4 select,
.down-4 .txt5 {
    width: 32%;
    overflow: hidden;
    box-sizing: border-box;
    margin-top: 30px;
    border: 1px #e3e3e3 solid;
    height: 60px;
    line-height: 60px;
    background: #fff;
    padding: 0px 40px;
    font-size: 16px;
    color: #666;
}

.down-4 .txt5::placeholder {
    color: #666 !important;
    opacity: 1;
}

.down-4 .txt5::-webkit-input-placeholder {
    color: #666 !important;
    opacity: 1;
}

.down-4 .txt5::-ms-input-placeholder {
    color: #666 !important;
    opacity: 1;
}

.down-4 .txt5::-moz-placeholder {
    color: #666 !important;
    opacity: 1;
}

.down-4 select {
    background: url("../images/icon-108.png") no-repeat 92% center;
}

.down-4 textarea {
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    margin-top: 30px;
    border: 1px #e3e3e3 solid;
    background: #fff;
    padding: 20px 40px;
    font-size: 16px;
    color: #666;
    line-height: 24px;
    height: 180px;
}

.down-4 textarea::placeholder {
    color: #666 !important;
    opacity: 1;
}

.down-4 textarea::-webkit-input-placeholder {
    color: #666 !important;
    opacity: 1;
}

.down-4 textarea::-ms-input-placeholder {
    color: #666 !important;
    opacity: 1;
}

.down-4 textarea::-moz-placeholder {
    color: #666 !important;
    opacity: 1;
}

.down-4bt {
    width: 100%;
    overflow: hidden;
    padding-top: 80px;
}

.down-4bt input {
    width: 226px;
    height: 60px;
    line-height: 60px;
    display: block;
    margin: 0px auto;
    overflow: hidden;
    cursor: pointer;
    background: #006ab7;
    text-align: center;
    font-size: 16px;
    color: #fff;
}

.down-4bt input:hover {
    transform: translateY(-3px);
}

.down-4 select:hover,
.down-4 .txt5:hover,
.down-4 textarea:hover {
    border-color: #006ab7;
}

/*touzizhe*/
.tz-1 {
    width: 100%;
    overflow: hidden;
    padding: 80px 0px 100px;
}

.tz-1 iframe {
    margin: 0px auto;
    display: block;
    overflow: hidden;
}

.tz-2 {
    width: 100%;
    overflow: hidden;
    padding: 90px 0px 110px;
    background: #f7f7f7;
}

.tz-2 .h3 {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 42px;
    font-weight: bold;
    color: #333;
    position: relative;
    padding-bottom: 20px;
}

.tz-2 .h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    background: #006ab7;
}

.tz-2 ul {
    width: 100%;
    overflow: hidden;
    text-align: center;
    margin-top: 50px;
    font-size: 0px;
}

.tz-2 ul li {
    width: 180px;
    overflow: hidden;
    display: inline-block;
    height: 52px;
    line-height: 52px;
    box-sizing: border-box;
    border: 1px #006ab7 solid;
    margin: 0px 10px;
}

.tz-2 ul li a {
    width: 100%;
    display: block;
    height: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 18px;
    color: #006ab7;
}

.tz-2 ul li.active,
.tz-2 ul li:hover {
    background: #006ab7;
}

.tz-2 ul li.active a,
.tz-2 ul li:hover a {
    color: #fff;
}

.tz-2content {
    width: 81.25%;
    overflow: hidden;
    margin: 20px auto 0px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.tz-2item {
    width: 49.5%;
    overflow: hidden;
    background: #fff;
    margin-top: 20px;
}

.tz-2item a {
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: block;
    padding: 30px;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.tz-2left {
    width: auto;
    overflow: hidden;
    position: relative;
    color: #006ab7;
    padding-right: 30px;
}

.tz-2left:before {
    width: 1px;
    content: "";
    position: absolute;
    right: 0px;
    top: 15px;
    background: #006ab7;
    height: 100%;
}

.tz-2left span {
    width: 100%;
    text-align: center;
    overflow: hidden;
    display: block;
    font-size: 42px;
    font-family: "dinbold";
}

.tz-2left em {
    width: 100%;
    text-align: center;
    overflow: hidden;
    display: block;
    font-size: 14px;
}

.tz-2right {
    width: calc(100% - 112px);
    overflow: hidden;
    margin-top: 10px;
}

.tz-2right span {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 16px;
    color: #222;
    line-height: 28px;
}

.tz-2right em {
    float: left;
    width: 100%;
    overflow: hidden;
    font-size: 16px;
    color: #222;
    line-height: 28px;
}

.tz-2item:hover {
    background: #006ab7;
}

.tz-2item:hover .tz-2left span,
.tz-2item:hover .tz-2left em,
.tz-2item:hover .tz-2right span,
.tz-2item:hover .tz-2right em {
    color: #fff;
}

.tz-2item:hover .tz-2left:before {
    background: #fff;
}

.tz-3 {
    width: 100%;
    overflow: hidden;
    padding: 110px 0px;
}

.tz-3 .h3 {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 42px;
    font-weight: bold;
    color: #333;
    position: relative;
    padding-bottom: 20px;
}

.tz-3 .h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    background: #006ab7;
}

.tz-3content {
    width: 81.25%;
    margin: 50px auto 0px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.tz-3item {
    width: 32%;
    overflow: hidden;
    background: #f5f5f5;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-content: center;
    height: 10.41vw;
}

.tz-3item a {
    width: 100%;
    overflow: hidden;
    display: block;
    height: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-content: center;
}

.tz-3item samp {
    width: 100%;
    display: block;
    overflow: hidden;
    position: relative;
    height: 32px;
}

.tz-3item samp img {
    width: auto;
    height: auto;
    max-height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.tz-3item samp img:last-child {
    opacity: 0;
}

.tz-3item span {
    width: 100%;
    display: block;
    overflow: hidden;
    text-align: center;
    font-size: 16px;
    color: #808080;
    margin-top: 10px;
}

.tz-3item:hover {
    background: #006ab7;
}

.tz-3item:hover samp img {
    opacity: 0;
}

.tz-3item:hover samp img:last-child {
    opacity: 1;
}

.tz-3item:hover span {
    color: #fff;
}

.tz-map {
    width: 81.25%;
    overflow: hidden;
    margin: 30px auto 0px;
    height: 480px;
}

.amap-logo {
    display: none !important;
}

/*server*/
.server-1 {
    width: 100%;
    overflow: hidden;
    padding: 80px 0px 50px;
    background: #f5f5f5;
}

.server-1 .h3 {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 42px;
    font-weight: bold;
    color: #333;
    position: relative;
    padding-bottom: 20px;
}

.server-1 .h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    background: #006ab7;
}

.server-1center {
    width: 81.25%;
    overflow: hidden;
    position: relative;
    margin: 0px auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.server-1left {
    width: 40%;
    overflow: hidden;
}

.server-1left ul {
    width: 100%;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
}

.server-1left ul li {
    width: 24%;
    height: 50px;
    line-height: 50px;
    overflow: hidden;
    box-sizing: border-box;
    border: 1px #e4e4e4 solid;
    background: #fff;
    text-align: center;
    cursor: pointer;
    font-size: 16px;
    color: #999;
    margin: 7px 1.33% 0px 0px;
}

.server-1left ul li:nth-child(4n) {
    margin-right: 0px;
}

.server-1left ul li.active {
    background: #006ab7;
    color: #fff;
}

.server-1cont {
    width: 100%;
    overflow: hidden;
    margin-top: 19px;
    background: #fff;
    height: 21vw;
    box-sizing: border-box;
    padding: 40px;
}

.server-1pannel {
    width: 100%;
    height: 100%;
    position: absolute;
    opacity: 0;
    z-index: 1;
}

.server-1pannel.active {
    position: relative;
    z-index: 2;
    animation: opa 1s ease 1;
    animation-fill-mode: forwards;
}

.server-1item {
    width: 100%;
    overflow: hidden;
    margin-top: 34px;
}

.server-1item:first-child {
    margin-top: 0px;
}

.server-1item span {
    float: left;
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    padding-left: 14px;
    font-size: 18px;
    color: #333;
    position: relative;
}

.server-1item span:before {
    width: 4px;
    height: 4px;
    content: "";
    position: absolute;
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 50%;
    background: #006ab7;
}

.server-1item p {
    float: left;
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    padding-left: 14px;
    font-size: 16px;
    color: #999;
    line-height: 24px;
    margin-top: 4px;
}

.server-1cont .mCSB_scrollTools .mCSB_draggerContainer {
    background: none;
}

.server-1right {
    width: 58.33%;
    overflow: hidden;
    position: relative;
}

.server-1map {
    float: left;
    width: 100%;
    overflow: hidden;
}

.server-1map img {
    width: 100%;
    height: auto;
}

f .server-1bg {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 12;
}

.server-1bg span {
    width: 100%;
    height: 100%;
    position: absolute;
    display: block;
    overflow: hidden;
    left: 0px;
    top: 0px;
    opacity: 0;
}

.server-1bg span img {
    width: 100%;
    height: auto;
}

.server-1bg span.active {
    opacity: 1;
}

.server-1pos {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 20;
    overflow: hidden;
}

.server-1icon {
    width: auto;
    position: absolute;
    cursor: pointer;
    transform: translate(-50%, -50%);
}

.server-1icon samp {
    width: 16px;
    height: 20px;
    display: block;
    margin: 0px auto;
    position: relative;
}

.server-1icon samp:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../images/icon-113.png") no-repeat center;
}

.server-1icon samp:after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url("../images/icon-113-1.png") no-repeat center;
    opacity: 0;
}

.server-1icon span {
    width: 100%;
    overflow: hidden;
    display: block;
    font-size: 16px;
    color: #006ab7;
    margin-top: 4px;
}

.server-1icon.active samp:before {
    opacity: 0;
}

.server-1icon.active samp:after {
    opacity: 1;
}

.server-1icon.active span {
    color: #fff;
}

.server-1icon.icon1 {
    left: 69%;
    top: 43%;
}

.server-1icon.icon2 {
    left: 66%;
    top: 64%;
}

.server-1icon.icon3 {
    left: 85%;
    top: 21%;
}

.server-1icon.icon4 {
    left: 37%;
    top: 49%;
}

.server-1icon.icon5 {
    left: 42%;
    top: 65%;
}

.server-1icon.icon6 {
    left: 62%;
    top: 84%;
}

.server-1icon.icon7 {
    left: 80%;
    top: 62%;
}

.server-2 {
    width: 100%;
    overflow: hidden;
    padding: 100px 0px;
}

.server-2center {
    width: 81.25%;
    overflow: hidden;
    margin: 0px auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0px 40px 0px 80px;
    box-sizing: border-box;
}

.server-2left {
    width: 39.97%;
    position: relative;
}

.server-2cir {
    width: 100%;
}

.server-2cir img {
    width: 100%;
    height: auto;
}

.server-cir1 {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    animation: cir1 1.6s linear infinite;
    opacity: 0;
}

.server-cir1 img {
    width: 100%;
    height: auto;
}

.server-cir2 {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    animation: cir2 1.6s linear infinite;
    opacity: 0;
}

.server-cir2 img {
    width: 100%;
    height: auto;
}

.server-cir3 {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    animation: cir3 1.6s linear infinite;
    opacity: 0;
}

.server-cir3 img {
    width: 100%;
    height: auto;
}

.server-cir4 {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    animation: cir4 1.6s linear infinite;
}

.server-cir4 img {
    width: 100%;
    height: auto;
}

.server-2right {
    width: 52%;
    overflow: hidden;
}

.server-2right .h3 {
    float: left;
    width: 100%;
    overflow: hidden;
    position: relative;
    font-size: 42px;
    color: #222;
    padding-bottom: 24px;
    font-weight: bold;
}

.server-2right .h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: #006ab7;
}

.server-2info {
    float: left;
    width: 100%;
    overflow: hidden;
    line-height: 36px;
    font-size: 16px;
    color: #333;
    margin-top: 20px;
}

.server-2des {
    float: left;
    width: auto;
    padding-left: 60px;
    background: url("../images/icon-122.png") no-repeat left center;
    background-size: 50px 50px;
    margin-top: 40px;
}

.server-2des span {
    width: 100%;
    overflow: hidden;
    display: block;
    font-size: 24px;
    font-weight: bold;
}

.server-2des span a {
    color: #006ab7;
}

.server-2des p {
    width: 100%;
    overflow: hidden;
    font-size: 16px;
    color: #222;
    margin-top: 5px;
}

.server-3 {
    width: 100%;
    overflow: hidden;
    padding: 110px 0px 80px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.server-3 .h3 {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 42px;
    font-weight: bold;
    color: #333;
    position: relative;
    padding-bottom: 20px;
}

.server-3 .h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    background: #006ab7;
}

.server-3 .down-3content {
    margin-top: 40px;
    padding-bottom: 0px;
}

.server-3 ul {
    width: 81.25%;
    margin: 0px auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    box-sizing: border-box;
}

.server-3 ul li {
    width: 100%;
    overflow: hidden;
    background: #fff;
    margin-top: 25px;
    box-shadow: 0px 0px 12px 4px rgba(0, 0, 0, 0.02);
    height: 60px;
    line-height: 60px;
    box-sizing: border-box;
    padding: 0px 40px;
}

.server-3 ul li span {
    float: left;
    width: 85%;
    height: 100%;
    overflow: hidden;
    box-sizing: border-box;
    padding-left: 40px;
    background: url("../images/icon-94.png") no-repeat left center;
    font-size: 20px;
    color: #353535;
}

.server-3 ul li span a {
    color: #353535;
}

.server-3 ul li em {
    float: right;
    width: 21px;
    height: 100%;
    overflow: hidden;
    background: url("../images/icon-95.png") no-repeat center;
}

.server-3 ul li em a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
}

.server-3 ul li:hover {
    box-shadow: 0px 0px 12px 4px rgba(0, 0, 0, 0.06);
}

.server-3 ul li:hover span a {
    color: #006ab7;
}

.server-3 ul li:hover em {
    transform: translateY(3px);
}

.server-3more {
    width: 230px;
    margin: 50px auto 0px;
    height: 60px;
    line-height: 60px;
    overflow: hidden;
    background: #006ab7;
}

.server-3more a {
    width: 100%;
    height: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 16px;
    color: #fff;
    display: block;
}

.server-3more:hover {
    transform: translateY(3px);
}

.server-4 {
    width: 100%;
    overflow: hidden;
    padding: 110px 0px 70px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.server-4 .h3 {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 42px;
    font-weight: bold;
    color: #fff;
    position: relative;
    padding-bottom: 20px;
}

.server-4 .h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    background: #fff;
}

.server-4nav {
    width: 100%;
    height: 80px;
    overflow: hidden;
    margin-top: 60px;
}

.server-4 ul {
    width: 100%;
    overflow: hidden;
    margin: 0px auto;
    display: flex;
    justify-content: center;
    align-items: baseline;
}

.server-4 ul li {
    width: auto;
    overflow: hidden;
    margin: 0px 14px;
    cursor: pointer;
    color: rgba(255, 255, 255, 0.4);
    font-size: 16px;
    position: relative;
    padding: 0px 36px 15px;
}

.server-4 ul li:before {
    width: 100%;
    height: 1px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 2px;
    background: rgba(255, 255, 255, 0.4);
}

.server-4 ul li:after {
    width: 0%;
    height: 1px;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 2px;
    background: white;
}

.server-4 ul li.active {
    padding-bottom: 22px;
    color: #fff;
}

.server-4 ul li.active:after {
    width: 100%;
}

.server-4 ul li span {
    width: 6px;
    height: 6px;
    display: block;
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: #fff;
    border-radius: 50%;
    opacity: 0;
}

.server-4 ul li.active span {
    opacity: 1;
}

.server-4content {
    width: 81.25%;
    overflow: hidden;
    margin: 0px auto;
    position: relative;
}

.server-4pannel {
    width: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    opacity: 0;
    z-index: 1;
}

.server-4pannel.active {
    position: relative;
    opacity: 1;
    z-index: 2;
}

.server-4item {
    float: left;
    width: 32%;
    overflow: hidden;
    margin-right: 2%;
}

.server-4item:nth-child(3n) {
    margin-right: 0px;
}

.server-4item a {
    width: 100%;
    display: block;
    overflow: hidden;
    height: 100%;
}

.server-4item samp {
    width: 100%;
    height: 14.84vw;
    overflow: hidden;
    display: block;
}

.server-4item samp img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.server-4item:hover samp img {
    transform: scale(1.03);
}

.server-4item span {
    width: 100%;
    display: block;
    overflow: hidden;
    line-height: 36px;
    font-size: 20px;
    color: #fff;
    margin-top: 10px;
}

.server-4item:hover span {
    color: #006ab7;
}

.server-4more {
    width: 230px;
    margin: 90px auto 0px;
    height: 60px;
    line-height: 60px;
    overflow: hidden;
    background: #006ab7;
}

.server-4more a {
    width: 100%;
    height: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 16px;
    color: #fff;
    display: block;
}

.server-4more:hover {
    transform: translateY(3px);
}

.new-bread {
    margin-top: 0px !important;
}

.new-bread .bread-center {
    width: 81.25%;
}

@media screen and (max-width:1660px) {

    /*header*/
    .header {
        height: 80px;
    }

    .header .logo {
        width: 300px;
    }

    .header .logo a {
        width: 100%;
        height: 100%;
        display: block;
        overflow: hidden;
    }

    .header-code {
        margin: 22px 0px 0px 15px;
        padding-left: 16px;
    }

    .header-code span {
        font-size: 15px;
        letter-spacing: 2px;
    }

    .header-code p {
        font-size: 16px;
    }

    .header-lang {
        margin-left: 25px;
        margin-top: calc((80px - 12px)/2);
    }

    .header-right ul li {
        margin-left: 3vw;
    }

    .header-right ul li span {
        line-height: 80px;
    }

    .header-right ul li.icon span:before {
        height: 80px;
    }

    .header-right ul li.icon span:after {
        height: 80px;
    }

    .header-right ul li span a {
        font-size: 14px;
    }

    .header-right ul li.icon span {
        padding-right: 14px;
    }

    .header-right ul li.icon.on span:before,
    .header-right ul li.icon:hover span:before {
        opacity: 0;
    }

    .header-right ul li.icon.on span:after,
    .header-right ul li.icon:hover span:after {
        opacity: 1;
    }

    .header-search {
        margin-top: calc((80px - 22px)/2);
    }

    .sub-nav,
    .subs {
        top: 80px;
    }

    .navs {
        top: 80px;
        height: 540px;
    }

    .navs-left {
        width: 400px;
    }

    .navs-ul {
        margin: 25px auto 0px;
    }

    .navs-li {
        height: 50px;
        line-height: 50px;
        margin-top: 25px;
    }

    .navs-li p {
        font-size: 16px;
    }

    .navs-right {
        width: calc(100% - 400px);
    }

    .navs-form {
        margin: 50px auto 0px;
    }

    .navs-form form {
        height: 40px;
        line-height: 40px;
    }

    .navs-form .txt6 {
        padding: 0px 50px 0px 20px;
    }

    .navs-form .bt6 {
        width: 40px;
        height: 40px;
    }

    .navs-form p {
        line-height: 40px;
    }

    .navs-form p a {
        margin: 5px 0px 0px 20px;
    }

    .navs-model {
        height: 400px;
    }

    .navs-pannel h4 {
        font-size: 16px;
        margin-top: 30px;
    }

    .nav-item {
        font-size: 14px;
    }

    /*footer*/
    .footer-1 {
        margin: 80px auto 0px;
    }

    .footer-1left span {
        font-size: 20px;
    }

    .footer-1left em {
        font-size: 46px;
    }

    .footer-1left ul {
        margin-top: 10px;
    }

    .footer-1right span {
        font-size: 20px;
    }

    .footer-1right ul {
        margin-top: 30px;
    }

    .footer-1right ul li {
        width: 42px;
        height: 42px;
    }

    .footer-2 {
        padding-bottom: 40px;
        padding-top: 35px;
    }

    .footer-2item {
        margin-right: 4vw;
    }

    .footer-2item .h3 {
        font-size: 16px;
        padding-bottom: 18px;
    }

    .footer-2item ul li {
        line-height: 34px;
    }

    .footer-2right samp {
        width: 150px;
    }

    .footer-2right span {
        margin-top: 20px;
    }

    .footer-3 {
        padding: 50px 0px;
    }

    .footer-3 ul li {
        margin-right: 30px;
    }

    .footer-form {
        width: 24%;
        margin-left: 3vw;
    }

    .footer-form span {
        font-size: 20px;
    }

    .footer-form form {
        height: 36px;
        line-height: 36px;
        margin-top: 17px;
    }

    .footer-form p {
        font-size: 12px;
        line-height: 20px;
    }

    /*right-nav*/
    .menu-pos {
        right: 40px;
    }

    /*home-banner*/
    .banner-ver {
        top: 35%;
    }

    .banner-ver .h3 {
        font-size: 46px;
        line-height: 64px;
    }

    .banner-ver p {
        font-size: 18px;
        line-height: 28px;
        margin-top: 18px;
    }

    .banner-ver span {
        font-size: 24px;
        margin-top: 50px;
    }

    .banner-other {
        bottom: 120px;
    }

    .banner-other .swiper-button-prev {
        width: 46px;
        height: 46px;
        right: 240px;
    }

    .banner-other .swiper-button-next {
        width: 46px;
        height: 46px;
    }

    .banner-other .swiper-pagination {
        top: 0px;
    }

    .banner-wz {
        width: 88%;
    }

    .banner-wz .h3 {
        font-size: 48px;
        line-height: 60px;
    }

    .banner-wz1 {
        margin-top: 25px;
    }

    .banner-wz1 span,
    .banner-wz1 p {
        line-height: 40px;
        font-size: 26px;
    }

    .banner-wz ul {
        margin-top: 25px;
    }

    .banner-wz ul li samp {
        margin-right: 14px;
    }

    .banner-wz ul li samp img {
        height: 40px;
    }

    .banner-right {
        font-size: 14px;
    }

    .banner-detail {
        margin-top: 5vw;
    }

    .banner-detail a {
        width: 150px;
        height: 50px;
        line-height: 50px;
    }

    /*home-about*/
    .habout-1 .h3 {
        font-size: 40px;
    }

    .habout-1info {
        width: 54%;
        font-size: 20px;
        line-height: 32px;
        margin-top: 20px;
        padding-bottom: 35px;
    }

    .habout-1des {
        width: 54%;
        font-size: 15px;
        line-height: 28px;
        margin-top: 30px;
    }

    .habout-1more {
        width: 54%;
        margin-top: 50px;
    }

    .habout-item {
        height: 140px;
    }

    .habout-item samp {
        height: 46px;
    }

    .habout-item p {
        height: 46px;
        font-size: 18px;
        line-height: 46px;
    }

    .habout-item p em {
        font-size: 50px;
    }

    .habout-item span {
        font-size: 15px;
        margin-top: 15px;
    }

    .habout ul li:nth-child(6) p,
    .habout ul li:nth-child(7) p {
        font-size: 34px;
    }

    /*home-apply*/
    .happ-content {
        top: 80px;
        height: calc(100% - 80px - 100px);
    }

    .happ-content .swiper-slide .h3 {
        font-size: 40px;
        padding-bottom: 20px;
    }

    .happ-content .swiper-slide .h3:before {
        width: 80px;
    }

    .happ-info {
        width: 800px;
        line-height: 28px;
        font-size: 15px;
        margin-top: 30px;
    }

    .happ-more {
        margin-top: 50px;
    }

    .happ-item {
        height: 100px;
    }

    .happ-item samp {
        height: 36px;
    }

    .happ-item span {
        font-size: 14px;
        margin-top: 10px;
    }

    .happ ul li,
    .happ ul li.active .happ-item {
        height: 180px;
    }

    .happ ul li.active .happ-item samp {
        height: 60px;
    }

    .happ ul li.active .happ-item span {
        font-size: 24px;
    }

    /*home-product*/
    .hpro-center {
        margin-top: calc(80px/2);
    }

    .hpro-left .h3 {
        font-size: 40px;
        padding-bottom: 20px;
    }

    .hpro-info {
        font-size: 15px;
        margin-top: 20px;
    }

    .hpro-left ul {
        margin-top: 40px;
    }

    .hpro-left ul li samp {
        width: 64px;
        height: 64px;
    }

    .hpro-left ul li span {
        font-size: 14px;
    }

    .hpro-button {
        width: 220px;
    }

    .hpro-cont .swiper-pagination {
        font-size: 36px;
    }

    .hpro-title span {
        font-size: 14px;
    }

    /*home-news*/
    .hnews {
        padding-top: 80px;
    }

    .hnews-head .h3 {
        font-size: 40px;
    }

    .hnews-head .swiper-button-next {
        top: 30px;
    }

    .hnews-head .swiper-button {
        top: 10px;
    }

    .hnews-content {
        margin: 2vw auto 0px;
    }

    .hnews-left {
        height: 32vw;
    }

    .hnews-cont .h4 {
        font-size: 20px;
        line-height: 30px;
    }

    .hnews-info {
        font-size: 14px;
    }

    .hnews-left em {
        bottom: 20px;
        font-size: 15px;
    }

    .hnews-center {
        height: 32vw;
    }

    .hnews-model span {
        margin: 24px auto 0px;
        font-size: 18px;
    }

    .hnews-model em {
        font-size: 15px;
    }

    .hnews-right {
        height: 32vw;
    }

    .hnews-right span {
        left: 26px;
        top: 26px;
        font-size: 22px;
    }

    /*home-pinpai*/
    .hpin-1 {
        margin-top: calc(80px/2);
    }

    .hpin-3 .h3 {
        font-size: 44px;
    }

    /*news*/
    .banner-news {
        margin-top: 80px;
    }

    .banner-center .h3 {
        font-size: 40px;
    }

    .banner-center p {
        font-size: 20px;
    }

    .bread-nav {
        height: 54px;
        line-height: 54px;
    }

    .bread-nav ul li {
        padding: 0px 35px;
    }

    .bread-nav ul li a {
        font-size: 15px;
    }

    .banner-info {
        width: 40%;
        line-height: 26px;
        font-size: 16px;
        margin-top: 8px;
    }

    .news {
        padding-bottom: 100px;
    }

    .news-form {
        padding: 40px 0px;
    }

    .news-form label {
        line-height: 50px;
        font-size: 20px;
    }

    .news-input {
        height: 50px;
        line-height: 50px;
        margin-left: 12px;
        padding: 0px 28px;
    }

    .news-input .txt {
        font-size: 14px;
    }

    .news-right {
        margin-left: 1vw;
    }

    .news-right span {
        margin: 11px 0px 0px 2.08vw;
    }

    .news-top {
        margin: 50px auto 0px;
    }

    .news-time {
        width: 70px;
        left: 30px;
        padding-bottom: 8px;
    }

    .news-time span {
        font-size: 32px;
    }

    .news-time em {
        font-size: 13px;
    }

    .news-1 p {
        bottom: 20px;
        padding: 0px 32px;
        font-size: 22px;
    }

    .news-item {
        padding: 60px 0px;
    }

    .news-model span {
        font-size: 24px;
    }

    .news-model p {
        font-size: 15px;
        margin-top: 12px;
    }

    .news-model em {
        font-size: 16px;
        margin-top: 30px;
    }

    .news-page {
        margin: 50px auto 0px;
    }

    /*news-info*/
    .detail {
        padding: 80px 0px;
    }

    .detail-center {
        padding: 70px;
    }

    .detail-center .h1 {
        font-size: 30px;
    }

    .detail-content {
        margin-top: 60px;
    }

    .detail-content p {
        margin-bottom: 25px;
    }

    .detail-page {
        margin-top: 90px;
        padding-top: 30px;
    }

    /*video*/
    .news-form.vd {
        margin-top: 50px;
    }

    .vd-1 span {
        height: 50px;
        line-height: 50px;
        margin-top: 0px;
    }

    .vd-1 span a {
        font-size: 15px;
    }

    .vd-list {
        padding-bottom: 60px;
    }

    .vd-item {
        margin: 50px 2% 0px 0px;
    }

    .vd-bottom {
        margin-top: 20px;
    }

    .vd-bottom span {
        font-size: 18px;
    }

    .vd-bottom p {
        font-size: 18px;
        margin-top: 8px;
    }

    /*about-company*/
    .about-1 {
        padding: 100px 0px 120px;
    }

    .about-1 .h3 {
        font-size: 36px;
    }

    .about-1content {
        margin: 70px auto 0px;
    }

    .about-1content .h4 {
        font-size: 22px;
        padding-bottom: 20px;
    }

    .about-1info {
        line-height: 28px;
        font-size: 15px;
        margin-top: 24px;
    }

    .about-1 ul {
        margin: 80px auto 0px;
    }

    .about-1 ul li samp {
        width: 42px;
        height: 42px;
        padding-right: 24px;
    }

    .about-1item {
        padding-left: 24px;
    }

    .about-1item span {
        font-size: 18px;
    }

    .about-1item span em {
        font-size: 50px;
    }

    .about-1 ul li:nth-child(3) .about-1item span,
    .about-1 ul li:nth-child(4) .about-1item span {
        font-size: 32px;
    }

    .about-1 ul li p {
        font-size: 14px;
        margin-top: -5px;
    }

    .about-1video {
        margin-top: 80px;
    }

    .about-2 {
        height: 480px;
    }

    .about-2 .h3 {
        font-size: 52px;
        margin-top: 130px;
    }

    .about-3 {
        padding-top: 90px;
    }

    .about-3 .h3 {
        font-size: 36px;
    }

    .about-3content {
        margin: 40px auto 0px;
    }

    .about-3item {
        height: 500px;
    }

    .about-3center span {
        font-size: 20px;
    }

    .about-3center p {
        line-height: 26px;
        font-size: 16px;
    }

    .about-3item.active .about-3center {
        top: 55px;
    }

    .about-3item.active .about-3center span {
        font-size: 32px;
    }

    .about-4 {
        padding: 80px 0px 100px;
        margin-top: 100px;
    }

    .about-4 .h3 {
        font-size: 36px;
    }

    .about-4nav {
        width: 81.25%;
        margin: 80px auto 0px;
    }

    .about-4nav:before {
        top: 53px;
    }

    .about-4line {
        top: 53px;
    }

    .about-4left,
    .about-4right {
        width: 40px;
        height: 40px;
        top: 34px;
    }

    .about-4nav .about-4model span {
        font-size: 20px;
    }

    .about-4nav .about-4model em {
        width: 26px;
        height: 26px;
        margin: 10px auto 0px;
    }

    .about-4nav .about-4model em samp {
        width: 16px;
        height: 16px;
    }

    .about-4nav .about-4model em samp:before {
        width: 4px;
        height: 4px;
    }

    .about-4nav .about-4model p {
        font-size: 18px;
        margin-top: 10px;
    }

    .about-4content {
        margin-top: 100px;
    }

    .about-4content .swiper-container {
        width: 81.25%;
    }

    .about-4date {
        font-size: 90px;
    }

    .about-4li {
        padding-bottom: 24px;
    }

    .about-4li span {
        font-size: 20px;
    }

    .about-4li p {
        font-size: 17px;
        line-height: 30px;
        margin-top: 10px;
    }

    .about-5 {
        padding: 90px 0px 80px;
    }

    .about-5 .h3 {
        font-size: 36px;
    }

    .about-5content {
        margin: 40px auto 0px;
    }

    .about-5item span {
        font-size: 18px;
        padding: 0px 20px;
        margin-top: 20px;
    }

    .about-5 ul {
        margin-top: 80px;
    }

    .about-5 ul li {
        width: 230px;
        height: 60px;
        line-height: 60px;
        margin: 0px 25px;
        font-size: 16px;
    }

    /*about-keji*/
    .kj-1 {
        margin: 90px auto 0px;
    }

    .kj-1 .h3 {
        font-size: 36px;
    }

    .kj-1info {
        line-height: 28px;
        font-size: 18px;
    }

    .kj-2 {
        padding-bottom: 120px;
    }

    .kj-pannel {
        margin-top: 80px;
        padding-bottom: 35px;
    }

    .kj-center p {
        font-size: 32px;
        margin-top: 10px;
    }

    .kj-2 ul {
        margin-top: 22px;
    }

    .kj-2 ul li {
        margin-top: 24px;
    }

    .kj-2 ul li em {
        width: 40px;
        height: 40px;
    }

    .kj-2 ul li p {
        width: calc(100% - 70px);
        line-height: 30px;
        font-size: 15px;
    }

    .kj-center span img {
        height: 64px;
        width: auto;
    }

    /*about-join*/
    .join {
        padding: 90px 0px 120px;
    }

    .join .h3 {
        font-size: 36px;
    }

    .join-content {
        margin: 50px auto 0px;
    }

    .join-center {
        top: 30px;
    }

    .join-center span {
        height: 56px;
    }

    .join-center p {
        font-size: 22px;
        margin-top: 14px;
    }

    /*about-contact*/
    .contact {
        padding: 90px 0px;
    }

    .contact .h3 {
        font-size: 36px;
    }

    .contact-1 {
        width: 70%;
        margin: 50px auto 0px;
    }

    .contact-1ver {
        left: 50px;
        bottom: 50px;
    }

    .contact-1ver span {
        font-size: 32px;
    }

    .contact-1ver p {
        line-height: 25px;
        font-size: 16px;
        padding-left: 36px;
    }

    .contact-2 {
        width: 70%;
    }

    .contact-2item {
        margin-top: 35px;
    }

    .contact-2cont span {
        font-size: 24px;
    }

    .contact-2info {
        line-height: 26px;
        font-size: 15px;
        margin-top: 40px;
    }

    .contact-3 {
        width: 70%;
    }

    .contact-3item {
        margin-top: 24px;
        padding: 30px 0px;
    }

    .contact-3item samp {
        height: 30px;
    }

    .contact-3item span {
        font-size: 15px;
        margin-top: 12px;
    }

    .contact-3item p {
        font-size: 18px;
        margin-top: 10px;
    }

    /*about-join-boshi*/
    .join-boshi {
        padding: 80px 0px 100px;
    }

    .join-1 {
        width: 81.25%;
    }

    .join-boshi .h3 {
        font-size: 36px;
    }

    .join-1info {
        line-height: 32px;
        font-size: 17px;
        margin-top: 35px;
    }

    .join-1info p {
        margin-top: 25px;
    }

    .join-2 {
        margin: 70px auto 0px;
    }

    .join-2content {
        margin-top: 50px;
    }

    .join-2item {
        margin-top: 35px;
    }

    .join-2right span {
        font-size: 26px;
    }

    .join-2right p {
        line-height: 25px;
        font-size: 15px;
        margin-top: 14px;
    }

    .join-2right em {
        font-size: 16px;
    }

    .join-boshi .news-page {
        margin-top: 120px;
    }

    /*about-join-zhaoxian*/
    .zx {
        padding: 80px 0px 110px;
    }

    .zx .h3 {
        font-size: 36px;
    }

    .zx-nav {
        margin-top: 50px;
    }

    .zx-nav span {
        width: 200px;
        height: 54px;
        line-height: 54px;
        margin: 0px 15px;
    }

    .zx-1 {
        margin: 50px auto 0px;
    }

    .zx-1item {
        height: 60px;
        line-height: 60px;
    }

    .zx-2left span {
        font-size: 18px;
    }

    .zx-2left em {
        font-size: 14px;
    }

    .zx-2right {
        width: 55px;
    }

    .zx .news-page {
        margin-top: 110px;
    }

    /*about-join-zhaoxian-detail*/
    .zx-detail {
        padding: 70px 0px 90px;
    }

    .zp-1ver span {
        font-size: 40px;
    }

    .zp-1ver em {
        margin-right: 70px;
    }

    .zp-2 {
        margin-top: 40px;
    }

    .zp-3 {
        margin-top: 60px;
        padding-bottom: 50px;
    }

    .zp-3 h3 {
        font-size: 20px;
        margin-bottom: 15px;
    }

    .zp-3 p {
        line-height: 30px;
        font-size: 14px;
    }

    .zp-4 {
        margin-top: 40px;
    }

    .zp-4 h3 {
        font-size: 20px;
        margin-bottom: 15px;
    }

    .zp-4 p {
        line-height: 30px;
        font-size: 14px;
    }

    .zp-2des {
        font-size: 14px;
        margin-top: 120px;
    }

    .zp-5 {
        margin-top: 50px;
    }

    .zp-5 input {
        font-size: 16px;
    }

    /*solve*/
    .solve-nav {
        height: 100px;
    }

    .solve-nav ul li samp {
        height: 35px;
    }

    .solve-nav ul li span {
        font-size: 15px;
        margin-top: 10px;
    }

    .solve-1 {
        margin: 110px auto 0px;
    }

    .solve-1 .h3 {
        font-size: 36px;
    }

    .solve-1info {
        font-size: 15px;
        margin-top: 30px;
    }

    .solve-2 {
        margin: 100px auto 0px;
        padding-bottom: 100px;
    }

    .solve-2 .h3 {
        font-size: 36px;
    }

    .solve-2item {
        margin-top: 35px;
    }

    .solve-2right span {
        font-size: 24px;
    }

    .solve-2info {
        line-height: 25px;
        font-size: 14px;
        margin: 16px auto 0px;
    }

    .solve-2more {
        margin: 30px auto 0px;
    }

    .solve-3 {
        padding: 90px 0px 100px;
    }

    .solve-3 .h3 {
        font-size: 36px;
    }

    .solve-3content {
        margin: 40px auto 0px;
    }

    .solve-3content .swiper-slide span {
        height: 66px;
        line-height: 66px;
        font-size: 18px;
    }

    /*solve-detail*/
    .bread-crumb {
        margin-top: 80px;
        height: 70px;
        line-height: 70px;
    }

    .solve-4 {
        margin: 50px auto 0px;
    }

    .solve-4right .h3 {
        font-size: 32px;
    }

    .solve-4info {
        line-height: 27px;
        font-size: 15px;
        margin-top: 1.4vw;
    }

    .solve-4right em {
        margin-top: 2vw;
    }

    .solve-5 {
        margin-top: 50px;
    }

    .solve-6 {
        height: 60px;
        margin-top: 60px;
    }

    .solve-6 ul {
        margin: 10px auto 0px;
        height: 50px;
        line-height: 50px;
    }

    .solve-6 ul li {
        font-size: 16px;
    }

    .solve-7 {
        margin-top: 32px;
        padding-bottom: 32px;
    }

    .solve-7pannel {
        padding: 70px 0px 60px;
    }

    .solve-7pannel .h4 {
        font-size: 22px;
    }

    .solve-7pannel ul li a {
        height: 60px;
        line-height: 60px;
        padding: 0px 32px;
    }

    .solve-7pannel ul li span {
        padding-left: 32px;
        font-size: 18px;
    }

    /*product*/
    .product {
        padding: 50px 0px 100px;
    }

    .pro-left {
        width: calc(290px + 2vw);
        top: calc(80px + 20px);
    }

    .pro-center {
        width: 290px;
    }

    .pro-title {
        height: 60px;
        line-height: 60px;
    }

    .pro-title a {
        padding: 0px 20px;
    }

    .pro-title span {
        font-size: 16px;
        padding-left: 26px;
    }

    .pro-cont {
        padding: 30px 28px;
    }

    .pro-item span {
        font-size: 15px;
    }

    .pro-model ul li {
        font-size: 13px;
    }

    .pro-right {
        width: calc(100% - 340px);
    }

    .pro-form {
        height: 40px;
        line-height: 40px;
    }

    .pro-form form {
        padding: 0px 15px;
    }

    .pro-form .txt3 {
        font-size: 14px;
    }

    .pro-model2 {
        margin-top: 40px;
    }

    .pro-name {
        font-size: 26px;
    }

    .pro-li {
        margin: 40px 2% 0px 0px;
    }

    .pro-li p {
        height: 60px;
    }

    .pro-li p span {
        font-size: 14px;
    }

    /*product-info*/
    .pro-1 {
        padding: 80px 0px;
    }

    .pro-1left .h3 {
        font-size: 36px;
    }

    .pro-1info {
        line-height: 27px;
        font-size: 15px;
        margin-top: 26px;
    }

    .pro-1more {
        margin-top: 50px;
    }

    .pro-2 {
        height: 60px;
        margin-top: 60px;
    }

    .pro-2 ul {
        margin: 10px auto 0px;
        height: 50px;
        line-height: 50px;
    }

    .pro-2 ul li {
        font-size: 16px;
    }

    .pro-3td {
        padding: 80px 0px 140px;
    }

    .pro-3td .h4 {
        font-size: 22px;
    }

    .pro-3info {
        line-height: 26px;
        font-size: 14px;
        margin-top: 15px;
    }

    .pro-3pannel ul {
        margin-top: 20px;
    }

    .pro-3pannel ul li {
        font-size: 14px;
        margin-top: 16px;
    }

    .pro-3des {
        line-height: 26px;
        font-size: 14px;
        margin-top: 40px;
    }

    .pro-3app {
        padding: 110px 0px 140px;
    }

    .pro-3model span {
        font-size: 22px;
    }

    .pro-3ct {
        line-height: 26px;
        font-size: 14px;
        margin-top: 50px;
    }

    .pro-3small .pro-3res {
        width: 260px;
        margin-left: 22px;
    }

    .pro-3small .pro-3res span {
        font-size: 15px;
    }

    .pro-3small .pro-3res em {
        font-size: 12px;
    }

    .pro-3rel {
        margin: 140px auto;
    }

    .pro-3rel span {
        margin-top: 32px;
        line-height: 26px;
        font-size: 16px;
    }

    .pro-3video {
        margin: 90px auto;
    }

    .pro-3item {
        padding-bottom: 30px;
    }

    .pro-3item span {
        font-size: 18px;
        margin-top: 40px;
    }

    .pro-3item p {
        font-size: 18px;
    }

    /*download*/
    .down-1 {
        padding: 50px 0px;
    }

    .down-1 form {
        width: 1000px;
    }

    .down-1cont {
        width: 1000px;
    }

    .down-1icon {
        height: 36px;
        line-height: 36px;
        margin-top: 17px;
    }

    .down-1icon samp {
        width: 26px;
    }

    .down-1icon span {
        margin-left: 12px;
    }

    .down-2 .h3 {
        font-size: 36px;
        margin-top: 90px;
    }

    .down-2content {
        margin-top: 25px;
    }

    .down-2content ul li {
        margin-top: 20px;
        padding: 0px 30px;
    }

    .down-2content ul li span {
        font-size: 18px;
    }

    .down-3content {
        margin: 50px auto 0px;
        padding-bottom: 100px;
    }

    .down-3item span {
        padding: 20px 10px;
        font-size: 20px;
    }

    .down-4 {
        padding: 100px 0px 150px;
    }

    .down-4 .h3 {
        font-size: 36px;
    }

    .down-4 select,
    .down-4 .txt5 {
        margin-top: 25px;
        height: 54px;
        line-height: 54px;
        padding: 0px 30px;
        font-size: 14px;
    }

    .down-4 textarea {
        margin-top: 25px;
        padding: 20px 30px;
        font-size: 14px;
    }

    .down-4bt {
        padding-top: 60px;
    }

    .down-4bt input {
        width: 200px;
        height: 54px;
        line-height: 54px;
        font-size: 14px;
    }

    /*touzizhe*/
    .tz-1 {
        padding: 70px 0px 90px;
    }

    .tz-2 {
        padding: 80px 0px 90px;
    }

    .tz-2 .h3 {
        font-size: 36px;
    }

    .tz-2 ul {
        margin-top: 40px;
    }

    .tz-2 ul li {
        width: 160px;
        height: 48px;
        line-height: 48px;
    }

    .tz-2 ul li a {
        font-size: 16px;
    }

    .tz-2item a {
        padding: 24px;
    }

    .tz-2left {
        padding-right: 24px;
    }

    .tz-2left span {
        font-size: 36px;
    }

    .tz-2right {
        width: calc(100% - 100px);
    }

    .tz-2right span {
        font-size: 15px;
        line-height: 26px;
    }

    .tz-2right em {
        font-size: 15px;
        line-height: 26px;
    }

    .tz-3 {
        padding: 100px 0px;
    }

    .tz-3 .h3 {
        font-size: 36px;
    }

    .tz-3content {
        margin: 40px auto 0px;
    }

    .tz-3item samp {
        height: 28px;
    }

    .tz-3item span {
        font-size: 15px;
    }

    /*server*/
    .server-1 {
        padding: 70px 0px 50px;
    }

    .server-1 .h3 {
        font-size: 36px;
    }

    .server-1left ul li {
        height: 40px;
        line-height: 40px;
        font-size: 14px;
    }

    .server-1cont {
        margin-top: 18px;
        height: 21vw;
        padding: 30px;
    }

    .server-1item {
        margin-top: 25px;
    }

    .server-1item span {
        font-size: 16px;
    }

    .server-1item p {
        font-size: 14px;
    }

    .server-2 {
        padding: 90px 0px;
    }

    .server-2center {
        padding: 0px 40px 0px 70px;
    }

    .server-2right .h3 {
        font-size: 36px;
        padding-bottom: 20px;
    }

    .server-2info {
        line-height: 32px;
        font-size: 14px;
        margin-top: 18px;
    }

    .server-3 {
        padding: 90px 0px 70px;
    }

    .server-3 .h3 {
        font-size: 36px;
    }

    .server-3 .down-3content {
        margin-top: 30px;
    }

    .server-3 ul li {
        margin-top: 20px;
        padding: 0px 30px;
    }

    .server-3 ul li span {
        padding-left: 30px;
        font-size: 18px;
    }

    .server-3more {
        width: 210px;
        margin: 40px auto 0px;
        height: 50px;
        line-height: 50px;
    }

    .server-3more a {
        font-size: 14px;
    }

    .server-4 {
        padding: 90px 0px 70px;
    }

    .server-4 .h3 {
        font-size: 36px;
    }

    .server-4nav {
        margin-top: 50px;
    }

    .server-4 ul li {
        margin: 0px 12px;
        font-size: 15px;
        padding: 0px 30px 12px;
    }

    .server-4 ul li.active {
        padding-bottom: 20px;
    }

    .server-4item span {
        line-height: 32px;
        font-size: 18px;
    }

    .server-4more {
        width: 210px;
        margin: 70px auto 0px;
        height: 50px;
        line-height: 50px;
    }

    .server-4more a {
        font-size: 14px;
    }
}

@media screen and (max-width:1440px) {

    /*header*/
    .header {
        height: 70px;
    }

    .header .logo {
        width: 200px;
    }

    .header-code {
        margin: 16px 0px 0px 15px;
    }

    .header-code span {
        letter-spacing: 0px;
    }

    .header-code p {
        font-size: 15px;
    }

    .header-lang {
        margin-left: 20px;
        margin-top: calc((70px - 12px)/2);
    }

    .header-right ul li span {
        line-height: 70px;
    }

    .header-right ul li.icon span:before {
        height: 70px;
    }

    .header-right ul li.icon span:after {
        height: 70px;
    }

    .header-search {
        margin-top: calc((70px - 22px)/2);
    }

    .sub-nav {
        top: 70px;
    }

    .sub-nav p {
        line-height: 32px;
    }

    .navs {
        top: 70px;
        height: 540px;
    }

    .subs {
        top: 70px;
    }

    /*footer*/
    .footer-1 {
        margin: 60px auto 0px;
    }

    .footer-1left span {
        font-size: 18px;
    }

    .footer-1left em {
        font-size: 38px;
    }

    .footer-1right span {
        font-size: 18px;
    }

    .footer-1right ul {
        margin-top: 24px;
    }

    .footer-1right ul li {
        width: 36px;
        height: 36px;
    }

    .footer-2 {
        padding-bottom: 30px;
        padding-top: 30px;
    }

    .footer-2item ul li {
        line-height: 32px;
    }

    .footer-2right samp {
        width: 120px;
    }

    .footer-2right span {
        margin-top: 17px;
    }

    .footer-3 {
        padding: 30px 0px;
    }

    .footer-3 ul li {
        margin-right: 20px;
    }

    .footer-form {
        width: 26%;
        margin-left: 2vw;
    }

    .footer-form span {
        font-size: 18px;
    }

    .footer-form form {
        height: 34px;
        line-height: 34px;
        margin-top: 16px;
    }

    /*right-nav*/
    .menu-pos {
        right: 20px;
    }

    /*home-banner*/
    .banner-ver {
        top: 35%;
    }

    .banner-ver .h3 {
        font-size: 32px;
        line-height: 50px;
    }

    .banner-other {
        bottom: 100px;
    }

    .banner-wz .h3 {
        font-size: 34px;
        line-height: 50px;
    }

    .banner-wz1 {
        margin-top: 20px;
    }

    .banner-wz1 span,
    .banner-wz1 p {
        line-height: 36px;
        font-size: 22px;
    }

    .banner-wz ul {
        margin-top: 20px;
    }

    .banner-wz ul li samp {
        margin-right: 12px;
    }

    .banner-wz ul li samp img {
        height: 35px;
    }

    .banner-detail {
        margin-top: 4vw;
    }

    /*home-about*/
    .habout-1 {
        margin-top: -20px;
    }

    .habout-1 .h3 {
        font-size: 28px;
    }

    .habout-1info {
        font-size: 17px;
        line-height: 28px;
        margin-top: 16px;
        padding-bottom: 24px;
    }

    .habout-1des {
        font-size: 14px;
        line-height: 26px;
        margin-top: 20px;
    }

    .habout-1more {
        margin-top: 40px;
    }

    .habout-1more a {
        width: 120px;
        height: 44px;
        line-height: 40px;
        border-width: 1px;
    }

    .habout-1more a span {
        font-size: 13px;
    }

    .habout-1more span:before,
    .habout-1more span:after {
        background-size: 8px;
    }

    .habout-item {
        height: 80px;
    }

    .habout-item samp {
        height: 32px;
    }

    .habout-item p {
        height: 32px;
        font-size: 14px;
        line-height: 3632pxpx;
    }

    .habout-item p em {
        font-size: 28px;
    }

    .habout-item span {
        font-size: 14px;
        margin-top: 10px;
    }

    .habout ul li:nth-child(6) p,
    .habout ul li:nth-child(7) p {
        font-size: 22px;
    }

    /*home-apply*/
    .happ-content {
        top: 70px;
        height: calc(100% - 70px - 80px);
    }

    .happ-content .swiper-slide .h3 {
        font-size: 28px;
    }

    .happ-content .swiper-slide .h3:before {
        width: 60px;
    }

    .happ-info {
        width: 720px;
        line-height: 26px;
        font-size: 14px;
        margin-top: 24px;
    }

    .happ-more {
        margin-top: 40px;
    }

    .happ-more a {
        width: 120px;
        height: 44px;
        line-height: 40px;
        border-width: 1px;
    }

    .happ-more a span {
        font-size: 13px;
    }

    .happ-more span:before,
    .happ-more span:after {
        background-size: 8px;
    }

    .happ-item {
        height: 80px;
    }

    .happ-item samp {
        height: 30px;
    }

    .happ-item span {
        margin-top: 8px;
    }

    .happ ul li,
    .happ ul li.active .happ-item {
        height: 120px;
    }

    .happ ul li.active .happ-item samp {
        height: 50px;
    }

    .happ ul li.active .happ-item span {
        font-size: 20px;
    }

    /*home-product*/
    .hpro-center {
        margin-top: calc(70px/2);
    }

    .hpro-left .h3 {
        font-size: 28px;
    }

    .hpro-info {
        font-size: 14px;
        margin-top: 16px;
    }

    .hpro-left ul {
        margin-top: 30px;
    }

    .hpro-left ul li samp {
        width: 56px;
        height: 56px;
    }

    .hpro-cont .swiper-pagination {
        font-size: 32px;
    }

    .hpro-bottom {
        margin-top: 2vw;
    }

    /*home-news*/
    .hnews {
        padding-top: 70px;
    }

    .hnews-head .h3 {
        font-size: 28px;
    }

    .hnews-head .swiper-button-next {
        top: 23px;
        width: 32px;
        height: 32px;
        background-size: 50%;
    }

    .hnews-head .swiper-button {
        width: 32px;
        height: 32px;
        top: 0px;
    }

    .hnews-left {
        height: 30vw;
    }

    .hnews-cont .h4 {
        font-size: 18px;
        line-height: 28px;
    }

    .hnews-info {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        margin-top: 12px;
    }

    .hnews-left em {
        bottom: 34px;
    }

    .hnews-center {
        height: 30vw;
    }

    .hnews-model span {
        margin: 18px auto 0px;
        font-size: 16px;
    }

    .hnews-right {
        height: 30vw;
    }

    /*home-pinpai*/
    .hpin-1 {
        margin-top: calc(70px/2);
    }

    .hpin-3 .h3 {
        font-size: 38px;
    }

    /*news*/
    .banner-news {
        margin-top: 70px;
    }

    .banner-center .h3 {
        font-size: 28px;
    }

    .banner-center p {
        font-size: 18px;
    }

    .bread-nav {
        height: 50px;
        line-height: 50px;
    }

    .bread-nav ul li {
        padding: 0px 30px;
    }

    .bread-nav ul li a {
        font-size: 14px;
    }

    .banner-info {
        width: 42%;
        line-height: 25px;
        font-size: 14px;
    }

    .news {
        padding-bottom: 80px;
    }

    .news-form {
        padding: 30px 0px;
    }

    .news-form label {
        line-height: 40px;
        font-size: 16px;
    }

    .news-input {
        height: 40px;
        line-height: 40px;
        margin-left: 10px;
        padding: 0px 15px;
        width: 280px;
    }

    .news-right span {
        margin: 6px 0px 0px 1vw;
        width: 6.4vw;
    }

    .news-top {
        margin: 40px auto 0px;
    }

    .news-time span {
        font-size: 26px;
    }

    .news-time em {
        font-size: 12px;
    }

    .news-1 p {
        padding: 0px 26px;
        font-size: 18px;
    }

    .news-item {
        padding: 25px 0px !important;
    }

    .news-item samp {
        width: 360px;
        height: 234px;
    }

    .news-model {
        width: calc(100% - 410px);
    }

    .news-model span {
        font-size: 18px;
    }

    .news-model p {
        font-size: 14px;
        margin-top: 10px;
    }

    .news-model em {
        font-size: 14px;
        margin-top: 24px;
    }

    .news-page {
        margin: 40px auto 0px;
    }

    /*news-info*/
    .detail {
        padding: 70px 0px;
    }

    .detail-center {
        padding: 60px;
    }

    .detail-center .h1 {
        font-size: 24px;
    }

    .detail-content {
        margin-top: 50px;
    }

    .detail-content p {
        margin-bottom: 20px;
    }

    .detail-page {
        margin-top: 70px;
        padding-top: 25px;
    }

    /*video*/
    .news-form.vd {
        margin-top: 40px;
    }

    .vd-1 span {
        height: 40px;
        line-height: 40px;
    }

    .vd-1 span a {
        font-size: 14px;
    }

    .vd-list {
        padding-bottom: 50px;
    }

    .vd-item {
        margin: 40px 2% 0px 0px;
    }

    .vd-bottom span {
        font-size: 16px;
    }

    .vd-bottom p {
        font-size: 16px;
        margin-top: 6px;
    }

    /*about-company*/
    .about-1 {
        padding: 80px 0px 100px;
    }

    .about-1 .h3 {
        font-size: 28px;
    }

    .about-1content {
        margin: 60px auto 0px;
    }

    .about-1content .h4 {
        font-size: 16px;
    }

    .about-1info {
        line-height: 26px;
        font-size: 14px;
        margin-top: 20px;
    }

    .about-1 ul {
        margin: 70px auto 0px;
    }

    .about-1 ul li samp {
        width: 36px;
        height: 36px;
        padding-right: 18px;
    }

    .about-1item {
        padding-left: 20px;
    }

    .about-1item span {
        font-size: 12px !important;
    }

    .about-1item span em {
        font-size: 34px;
    }

    .about-1 ul li:nth-child(3) .about-1item span,
    .about-1 ul li:nth-child(4) .about-1item span {
        font-size: 12px !important;
    }

    .about-1 ul li p {
        margin-top: -2px;
        font-size: 12px !important;
    }

    .about-1video {
        margin-top: 68px;
    }

    .about-2 {
        height: 460px;
    }

    .about-2 .h3 {
        font-size: 50px;
    }

    .about-3 {
        padding-top: 80px;
    }

    .about-3 .h3 {
        font-size: 28px;
    }

    .about-3content {
        margin: 35px auto 0px;
    }

    .about-3item {
        height: 460px;
    }

    .about-3center span {
        font-size: 18px;
    }

    .about-3center p {
        line-height: 25px;
        font-size: 14px;
    }

    .about-3item.active .about-3center {
        top: 50px;
    }

    .about-3item.active .about-3center span {
        font-size: 26px;
    }

    .about-4 {
        padding: 70px 0px 90px;
        margin-top: 90px;
    }

    .about-4 .h3 {
        font-size: 28px;
    }

    .about-4nav {
        width: 81.25%;
        margin: 60px auto 0px;
    }

    .about-4nav:before {
        top: 48px;
    }

    .about-4line {
        top: 48px;
    }

    .about-4left,
    .about-4right {
        width: 36px;
        height: 36px;
        top: 30px;
    }

    .about-4nav .about-4model span {
        font-size: 18px;
    }

    .about-4nav .about-4model p {
        font-size: 17px;
    }

    .about-4content {
        margin-top: 80px;
    }

    .about-4content .swiper-container {
        width: 81.25%;
    }

    .about-4date {
        font-size: 70px;
    }

    .about-4li {
        padding-bottom: 16px;
        min-height: 60px;
    }

    .about-4li span {
        font-size: 18px;
    }

    .about-4li p {
        font-size: 16px;
        line-height: 26px;
        margin-top: 6px;
    }

    .about-5 {
        padding: 80px 0px;
    }

    .about-5 .h3 {
        font-size: 28px;
    }

    .about-5content {
        margin: 35px auto 0px;
    }

    .about-5item span {
        font-size: 16px;
        padding: 0px 17px;
        margin-top: 18px;
    }

    .about-5 ul {
        margin-top: 60px;
    }

    .about-5 ul li {
        width: 210px;
        height: 54px;
        line-height: 54px;
        margin: 0px 20px;
        font-size: 15px;
    }

    /*about-keji*/
    .kj-1 {
        margin: 80px auto 0px;
    }

    .kj-1 .h3 {
        font-size: 28px;
    }

    .kj-1info {
        line-height: 26px;
        font-size: 16px;
    }

    .kj-2 {
        padding-bottom: 100px;
    }

    .kj-pannel {
        margin-top: 50px;
        padding-bottom: 30px;
    }

    .kj-center p {
        font-size: 28px;
    }

    .kj-2 ul {
        margin-top: 20px;
    }

    .kj-2 ul li {
        margin-top: 20px;
    }

    .kj-center span img {
        height: 60px;
    }

    /*about-join*/
    .join {
        padding: 80px 0px 100px;
    }

    .join .h3 {
        font-size: 28px;
    }

    .join-content {
        margin: 40px auto 0px;
    }

    /*about-contact*/
    .contact {
        padding: 80px 0px;
    }

    .contact .h3 {
        font-size: 28px;
    }

    .contact-1 {
        width: 80%;
        margin: 40px auto 0px;
    }

    .contact-1ver span {
        font-size: 28px;
    }

    .contact-2 {
        width: 80%;
    }

    .contact-2cont span {
        font-size: 24px;
    }

    .contact-2info {
        line-height: 26px;
        font-size: 15px;
        margin-top: 40px;
    }

    .contact-3 {
        width: 80%;
    }

    /*about-join-boshi*/
    .join-boshi {
        padding: 70px 0px 80px;
    }

    .join-1 {
        width: 81.25%;
    }

    .join-boshi .h3 {
        font-size: 28px;
    }

    .join-1info {
        line-height: 30px;
        font-size: 16px;
        margin-top: 30px;
    }

    .join-1info p {
        margin-top: 20px;
    }

    .join-2 {
        margin: 60px auto 0px;
    }

    .join-2content {
        margin-top: 40px;
    }

    .join-2item {
        margin-top: 30px;
    }

    .join-2right span {
        font-size: 18px;
    }

    .join-2right p {
        line-height: 24px;
        font-size: 14px;
        margin-top: 12px;
    }

    .join-2right em {
        font-size: 15px;
    }

    .join-boshi .news-page {
        margin-top: 100px;
    }

    /*about-join-zhaoxian*/
    .zx {
        padding: 70px 0px 90px;
    }

    .zx .h3 {
        font-size: 28px;
    }

    .zx-nav {
        margin-top: 40px;
    }

    .zx-nav span {
        width: 190px;
        height: 50px;
        line-height: 50px;
        margin: 0px 12px;
    }

    .zx-1 {
        margin: 40px auto 0px;
    }

    .zx-1item {
        height: 50px;
        line-height: 50px;
    }

    .zx-2left em {
        font-size: 14px;
    }

    .zx-2right {
        width: 50px;
    }

    .zx .news-page {
        margin-top: 90px;
    }

    /*about-join-zhaoxian-detail*/
    .zx-detail {
        padding: 60px 0px 70px;
    }

    .zp-1ver span {
        font-size: 32px;
    }

    .zp-1ver em {
        margin-right: 50px;
    }

    .zp-2 {
        margin-top: 30px;
    }

    .zp-3 {
        margin-top: 50px;
        padding-bottom: 40px;
    }

    .zp-3 h3 {
        font-size: 18px;
        margin-bottom: 14px;
    }

    .zp-3 p {
        line-height: 28px;
    }

    .zp-4 {
        margin-top: 30px;
    }

    .zp-4 h3 {
        font-size: 18px;
        margin-bottom: 14px;
    }

    .zp-4 p {
        line-height: 28px;
    }

    .zp-2des {
        margin-top: 100px;
    }

    .zp-5 {
        margin-top: 40px;
    }

    /*solve*/
    .solve-nav {
        height: 90px;
    }

    .solve-nav ul li samp {
        height: 30px;
    }

    .solve-nav ul li span {
        font-size: 14px;
    }

    .solve-1 {
        margin: 90px auto 0px;
    }

    .solve-1 .h3 {
        font-size: 28px;
    }

    .solve-1info {
        font-size: 14px;
        margin-top: 24px;
    }

    .solve-2 {
        margin: 90px auto 0px;
        padding-bottom: 90px;
    }

    .solve-2 .h3 {
        font-size: 28px;
    }

    .solve-2item {
        margin-top: 30px;
    }

    .solve-2right span {
        font-size: 22px;
    }

    .solve-2info {
        line-height: 24px;
        margin: 14px auto 0px;
    }

    .solve-2more {
        margin: 24px auto 0px;
    }

    .solve-3 {
        padding: 80px 0px;
    }

    .solve-3 .h3 {
        font-size: 28px;
    }

    .solve-3content {
        margin: 30px auto 0px;
    }

    .solve-3content .swiper-slide span {
        height: 60px;
        line-height: 60px;
        font-size: 16px;
    }

    /*solve-detail*/
    .bread-crumb {
        margin-top: 70px;
        height: 60px;
        line-height: 60px;
    }

    .solve-4 {
        margin: 40px auto 0px;
    }

    .solve-4right .h3 {
        font-size: 26px;
    }

    .solve-4info {
        line-height: 26px;
        font-size: 14px;
        margin-top: 1.3vw;
    }

    .solve-4right em {
        margin-top: 1.5vw;
    }

    .solve-5 {
        margin-top: 40px;
    }

    .solve-5 ul li a {
        font-size: 14px;
    }

    .solve-6 {
        height: 60px;
        margin-top: 50px;
    }

    .solve-6 ul {
        margin: 10px auto 0px;
        height: 50px;
        line-height: 50px;
    }

    .solve-6 ul li {
        font-size: 14px;
    }

    .solve-7 {
        margin-top: 25px;
    }

    .solve-7pannel {
        padding: 60px 0px 60px;
    }

    .solve-7pannel .h4 {
        font-size: 20px;
    }

    .solve-7pannel ul {
        margin-top: 20px;
    }

    .solve-7pannel ul li a {
        padding: 0px 26px;
    }

    .solve-7pannel ul li span {
        padding-left: 26px;
        font-size: 16px;
    }

    /*product*/
    .product .mCSB_inside>.mCSB_container {
        margin-right: 0px;
    }

    .product {
        padding: 40px 0px 80px;
    }

    .pro-left {
        top: calc(70px + 20px);
    }

    .pro-form {
        height: 40px;
        line-height: 40px;
    }

    .pro-model2 {
        margin-top: 30px;
    }

    .pro-name {
        font-size: 22px;
    }

    .pro-li {
        margin: 30px 2% 0px 0px;
    }

    /*product-info*/
    .pro-1 {
        padding: 70px 0px;
    }

    .pro-1left .h3 {
        font-size: 28px;
    }

    .pro-1info {
        line-height: 26px;
        font-size: 14px;
        margin-top: 22px;
    }

    .pro-1more {
        margin-top: 40px;
    }

    .pro-2 {
        margin-top: 50px;
    }

    .pro-3td {
        padding: 70px 0px 120px;
    }

    .pro-3td .h4 {
        font-size: 20px;
    }

    .pro-3app {
        padding: 90px 0px 110px;
    }

    .pro-3model span {
        font-size: 20px;
    }

    .pro-3ct {
        margin-top: 40px;
    }

    .pro-3rel {
        margin: 110px auto;
    }

    .pro-3rel span {
        margin-top: 30px;
        line-height: 25px;
        font-size: 14px;
    }

    .pro-3video {
        margin: 80px auto;
    }

    .pro-3item span {
        font-size: 16px;
        margin-top: 30px;
    }

    .pro-3item p {
        font-size: 16px;
    }

    /*download*/
    .down-2 .h3 {
        font-size: 28px;
        margin-top: 80px;
    }

    .down-2content {
        margin-top: 22px;
    }

    .down-2content ul li span {
        font-size: 16px;
    }

    .down-3content {
        margin: 40px auto 0px;
        padding-bottom: 80px;
    }

    .down-3item span {
        font-size: 16px;
    }

    .down-4 {
        padding: 80px 0px 120px;
    }

    .down-4 .h3 {
        font-size: 28px;
    }

    .down-4 select,
    .down-4 .txt5 {
        margin-top: 22px;
        height: 50px;
        line-height: 50px;
    }

    .down-4 textarea {
        margin-top: 22px;
    }

    .down-4bt {
        padding-top: 50px;
    }

    /*touzizhe*/
    .tz-1 {
        padding: 60px 0px 70px;
    }

    .tz-2 {
        padding: 70px 0px 80px;
    }

    .tz-2 .h3 {
        font-size: 28px;
    }

    .tz-2 ul {
        margin-top: 30px;
    }

    .tz-2item a {
        padding: 20px;
    }

    .tz-2left {
        padding-right: 22px;
    }

    .tz-2left span {
        font-size: 28px;
    }

    .tz-2right span {
        font-size: 14px;
        line-height: 25px;
    }

    .tz-2right em {
        font-size: 14px;
        line-height: 25px;
    }

    .tz-3 {
        padding: 80px 0px;
    }

    .tz-3 .h3 {
        font-size: 28px;
    }

    .tz-3content {
        margin: 30px auto 0px;
    }

    .tz-3item samp {
        height: 26px;
    }

    .tz-3item span {
        font-size: 14px;
    }

    /*server*/
    .server-1 {
        padding: 60px 0px;
    }

    .server-1 .h3 {
        font-size: 28px;
    }

    .server-2 {
        padding: 80px 0px;
    }

    .server-2center {
        padding: 0px 40px 0px 60px;
    }

    .server-2right .h3 {
        font-size: 28px;
    }

    .server-3 {
        padding: 80px 0px 60px;
    }

    .server-3 .h3 {
        font-size: 28px;
    }

    .server-3 ul li span {
        font-size: 16px;
    }

    .server-4 {
        padding: 70px 0px;
    }

    .server-4 .h3 {
        font-size: 28px;
    }

    .server-4nav {
        margin-top: 40px;
    }

    .server-4 ul li {
        font-size: 14px;
    }

    .server-4item span {
        font-size: 16px;
        line-height: 24px;
    }

    .server-4more {
        margin: 60px auto 0px;
    }
}

@media screen and (max-width:1366px) {
    .banner-new {
        bottom: 20px;
    }

    .hpro-nav span {
        font-size: 14px;
    }

    .hpro-bottom {
        margin-top: 0vw;
    }

    .hpin-3 .h3 {
        font-size: 30px;
    }

    .solve-2info {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 4;
    }

    .hpro-bottom {
        margin-top: 30px;
    }

    .pro-form {
        width: 50%;
    }
}

@media screen and (max-width:1280px) {

    /*header*/
    .header-right ul li {
        margin-left: 2vw;
    }

    .header-search {
        margin-left: 20px;
        padding-left: 20px;
    }

    .navs {
        height: 480px;
    }

    .navs-left {
        width: 350px;
    }

    .navs-li {
        height: 50px;
        line-height: 50px;
        margin-top: 25px;
    }

    .navs-right {
        width: calc(100% - 350px);
    }

    .navs-model {
        height: 300px;
    }

    /*footer*/
    .footer-1 {
        margin: 40px auto 0px;
    }

    .footer-1left em {
        font-size: 32px;
    }

    .footer-1right ul {
        margin-top: 20px;
    }

    .footer-2 {
        padding-bottom: 20px;
        padding-top: 20px;
    }

    .footer-2item ul li {
        line-height: 28px;
    }

    .footer-2item ul li a {
        font-size: 12px;
    }

    .footer-2right samp {
        width: 100px;
    }

    .footer-2right span {
        margin-top: 15px;
    }

    .footer-3 {
        padding: 20px 0px;
    }

    /*home-banner*/
    .banner-ver {
        top: 30%;
    }

    .banner-ver .h3 {
        font-size: 30px;
        line-height: 44px;
    }

    .banner-ver span {
        margin-top: 40px;
    }

    .banner-wz .h3 {
        font-size: 28px;
        line-height: 40px;
    }

    .banner-wz1 {
        margin-top: 18px;
    }

    .banner-wz1 span,
    .banner-wz1 p {
        line-height: 32px;
        font-size: 18px;
    }

    .banner-wz ul {
        margin-top: 18px;
    }

    .banner-wz ul li samp {
        margin-right: 10px;
    }

    .banner-detail {
        margin-top: 3vw;
    }

    /*home-about*/
    .habout-1 {
        margin-top: -20px;
    }

    .habout-1 .h3 {
        font-size: 26px;
    }

    .habout-1info {
        font-size: 15px;
        line-height: 26px;
        margin-top: 12px;
        padding-bottom: 18px;
    }

    .habout-1des {
        line-height: 25px;
        margin-top: 15px;
    }

    .habout-1more {
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .habout-1more a {
        width: 130px;
        height: 40px;
        line-height: 40px;
    }

    .habout-1more span {
        font-size: 14px;
        width: 72%;
    }

    .habout-1more span::before,
    .habout-1more span::after {
        background-size: 8px;
    }

    

    .habout-item {
        height: 90px;
    }

    .habout-item samp {
        height: 30px;
    }

    .habout-item p {
        height: 30px;
        font-size: 14px;
        line-height: 30px;
    }

    .habout-item p em {
        font-size: 26px;
    }

    .habout-item span {
        font-size: 12px;
        margin-top: 5px;
    }

    .habout ul li:nth-child(6) p,
    .habout ul li:nth-child(7) p {
        font-size: 20px;
    }

    /*home-apply*/
    .happ-content {
        height: calc(100% - 70px - 70px);
    }

    .happ-content .swiper-slide .h3 {
        font-size: 26px;
    }

    .happ-info {
        line-height: 25px;
        margin-top: 20px;
    }

    .happ-more {
        margin-top: 30px;
    }

    .happ-more a {
        width: 130px;
        height: 40px;
        line-height: 40px;
    }

    .happ-more span {
        font-size: 14px;
        width: 72%;
    }

    .happ-more span::before,
    .happ-more span::after {
        background-size: 8px;
    }

    .happ-item {
        height: 70px;
    }

    .happ-item samp {
        height: 24px;
    }

    .happ-item span {
        margin-top: 5px;
        font-size: 12px;
    }

    .happ ul li,
    .happ ul li.active .happ-item {
        height: 100px;
    }

    .happ ul li.active .happ-item samp {
        height: 34px;
    }

    .happ ul li.active .happ-item span {
        font-size: 16px;
    }

    /*home-product*/
    .hpro-center {
        margin-top: calc(70px/2);
    }

    .hpro-left {
        width: 44%;
    }

    .hpro-left .h3 {
        font-size: 26px;
    }

    .hpro-info {
        font-size: 14px;
        margin-top: 12px;
    }

    .hpro-left ul {
        margin-top: 20px;
    }

    .hpro-left ul li samp {
        width: 50px;
        height: 50px;
    }

    .hpro-right {
        width: 47%;
    }

    .hpro-button {
        width: 170px;
    }

    .hpro-button .swiper-button-next {
        top: 40px;
    }

    .hpro-cont .swiper-pagination {
        font-size: 30px;
    }

    .hpro-bottom {
        margin-top: 2vw;
    }

    .hpro-bottom .swiper-button-next {
        right: 2px;
    }

    .hpro-nav em {
        height: 40px;
    }

    .hpro-nav em:before,
    .hpro-nav em:after {
        background-size: auto 100%;
    }

    .hpro-nav span {
        margin-top: 0px;
    }

    /*home-news*/
    .hnews {
        padding-top: 70px;
    }

    .hnews-head .h3 {
        font-size: 26px;
    }

    .hnews-left {
        height: 32vw;
    }

    .hnews-cont {
        padding: 15px 15px 0px;
        height: 11vw;
    }

    .hnews-cont .h4 {
        font-size: 16px;
        line-height: 26px;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
    }

    .hnews-info {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
        margin-top: 10px;
    }

    .hnews-left em {
        bottom: 30px;
        left: 15px;
    }

    .hnews-center {
        height: 32vw;
    }

    .hnews-model span {
        margin: 14px auto 0px;
    }

    .hnews-model p {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
    }

    .hnews-right {
        height: 32vw;
    }

    /*home-pinpai*/
    .hpin-1 {
        margin-top: calc(70px/2);
    }

    .hpin-3 .h3 {
        font-size: 26px;
    }

    /*news*/
    .banner-news {
        margin-top: 70px;
    }

    .banner-center .h3 {
        font-size: 26px;
    }

    .news {
        padding-bottom: 70px;
    }

    .news-item {
        padding: 40px 0px;
    }

    .news-item samp {
        width: 300px;
        height: 195px;
    }

    .news-model {
        width: calc(100% - 350px);
    }

    .news-model span {
        font-size: 18px;
    }

    .news-model em {
        margin-top: 18px;
    }

    /*news-info*/
    .detail {
        padding: 60px 0px;
    }

    .detail-center {
        padding: 50px;
    }

    .detail-center .h1 {
        font-size: 22px;
    }

    .detail-content {
        margin-top: 40px;
    }

    .detail-content p {
        margin-bottom: 18px;
    }

    .detail-page {
        margin-top: 60px;
        padding-top: 20px;
    }

    /*video*/
    .vd-list {
        padding-bottom: 40px;
    }

    .vd-item {
        margin: 30px 2% 0px 0px;
    }

    .vd-bottom p {
        margin-top: 3px;
    }

    /*about-company*/
    .about-1 {
        padding: 60px 0px 70px;
    }

    .about-1 .h3 {
        font-size: 24px;
    }

    .about-1content {
        margin: 40px auto 0px;
    }

    .about-1info {
        margin-top: 16px;
    }

    .about-1video {
        height: 30vw;
    }

    .about-1video img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .about-1 ul {
        margin: 60px auto 0px;
    }

    .about-2 .h3 {
        font-size: 40px;
    }

    .about-3 {
        padding-top: 60px;
    }

    .about-3 .h3 {
        font-size: 24px;
    }

    .about-3content {
        margin: 30px auto 0px;
    }

    .about-3item {
        height: 380px;
    }

    .about-3item.active .about-3center span {
        font-size: 24px;
    }

    .about-4 {
        padding: 60px 0px;
        margin-top: 60px;
    }

    .about-4 .h3 {
        font-size: 24px;
    }

    .about-4nav {
        width: 81.25%;
        margin: 40px auto 0px;
    }

    .about-4content {
        margin-top: 50px;
    }

    .about-4content .swiper-container {
        width: 81.25%;
    }

    .about-4date {
        font-size: 60px;
    }

    .about-4li {
        min-height: 60px;
    }

    .about-4li span {
        font-size: 16px;
    }

    .about-4li p {
        font-size: 14px;
        line-height: 24px;
        margin-top: 5px;
    }

    .about-5 {
        padding: 60px 0px;
    }

    .about-5 .h3 {
        font-size: 24px;
    }

    .about-5content {
        margin: 30px auto 0px;
    }

    .about-5item span {
        font-size: 14px;
        padding: 0px 15px;
        margin-top: 15px;
    }

    .about-5 ul {
        margin-top: 50px;
    }

    /*about-keji*/
    .kj-1 {
        margin: 60px auto 0px;
    }

    .kj-1 .h3 {
        font-size: 24px;
    }

    .kj-1info {
        font-size: 14px;
    }

    .kj-2 {
        padding-bottom: 70px;
    }

    .kj-pannel {
        margin-top: 40px;
        padding-bottom: 25px;
    }

    .kj-center p {
        font-size: 24px;
    }

    .kj-center span img {
        height: 50px;
    }

    /*about-join*/
    .join {
        padding: 70px 0px 80px;
    }

    .join .h3 {
        font-size: 24px;
    }

    .join-content {
        margin: 35px auto 0px;
    }

    /*about-contact*/
    .contact {
        padding: 60px 0px;
    }

    .contact .h3 {
        font-size: 24px;
    }

    .contact-1 {
        margin: 30px auto 0px;
    }

    .contact-1ver span {
        font-size: 22px;
    }

    .contact-2cont span {
        font-size: 22px;
    }

    .contact-2info {
        font-size: 14px;
        margin-top: 30px;
    }

    /*about-join-boshi*/
    .join-boshi {
        padding: 60px 0px;
    }

    .join-boshi .h3 {
        font-size: 24px;
    }

    .join-1info {
        line-height: 27px;
        font-size: 14px;
        margin-top: 24px;
    }

    .join-1info p {
        margin-top: 14px;
    }

    .join-2 {
        margin: 50px auto 0px;
    }

    .join-2content {
        margin-top: 30px;
    }

    .join-2item {
        margin-top: 24px;
    }

    .join-2right em {
        margin-top: 2vw;
    }

    .join-boshi .news-page {
        margin-top: 70px;
    }

    /*about-join-zhaoxian*/
    .zx {
        padding: 60px 0px 70px;
    }

    .zx .h3 {
        font-size: 24px;
    }

    .zx-nav {
        margin-top: 30px;
    }

    .zx-1 {
        margin: 30px auto 0px;
    }

    .zx-2item a {
        padding: 15px;
    }

    .zx-2left span {
        font-size: 18px;
    }

    .zx-2right {
        width: 44px;
    }

    .zx .news-page {
        margin-top: 70px;
    }

    /*solve*/
    .solve-1 {
        margin: 70px auto 0px;
    }

    .solve-1 .h3 {
        font-size: 24px;
    }

    .solve-2 {
        margin: 70px auto 0px;
        padding-bottom: 70px;
    }

    .solve-2 .h3 {
        font-size: 24px;
    }

    .solve-2right span {
        font-size: 20px;
    }

    .solve-2info {
        margin: 12px auto 0px;
    }

    .solve-2more {
        margin: 20px auto 0px;
    }

    .solve-2more em {
        width: 130px;
        height: 40px;
        line-height: 40px;
    }

    .solve-3 {
        padding: 70px 0px;
    }

    .solve-3 .h3 {
        font-size: 24px;
    }

    .solve-3content .swiper-slide span {
        height: 50px;
        line-height: 50px;
        font-size: 14px;
    }

    /*solve-detail*/
    .bread-crumb {
        margin-top: 70px;
        height: 50px;
        line-height: 50px;
    }

    .solve-4right .h3 {
        font-size: 22px;
    }

    .solve-4info {
        margin-top: 1vw;
        font-size: 12px;
    }

    .solve-4right em a {
        font-size: 12px;
    }

    .solve-4right em {
        margin-top: 1vw;
    }

    .solve-5 {
        margin-top: 30px;
    }

    .solve-5 ul li a {
        font-size: 12px;
    }

    .solve-7pannel ul li a {
        height: 60px;
        line-height: 60px;
    }

    /*product*/
    .bread-center {
        font-size: 14px;
    }

    .pro-left {
        top: calc(70px + 20px);
    }

    .pro-form {
        width: 70%;
    }

    /*product-info*/
    .pro-1 {
        padding: 60px 0px;
    }

    .pro-1left .h3 {
        font-size: 24px;
    }

    .pro-1info {
        margin-top: 18px;
    }

    .pro-1more {
        margin-top: 30px;
    }

    .pro-2 {
        margin-top: 40px;
    }

    .pro-3td {
        padding: 60px 0px 80px;
    }

    .pro-3app {
        padding: 60px 0px 80px;
    }

    .pro-3rel {
        margin: 70px auto;
    }

    /*download*/
    .down-2 .h3 {
        font-size: 24px;
        margin-top: 70px;
    }

    .down-2content ul li {
        height: 60px;
        line-height: 60px;
    }

    .down-3content {
        padding-bottom: 70px;
    }

    .down-4 {
        padding: 60px 0px 70px;
    }

    .down-4 .h3 {
        font-size: 24px;
    }

    .down-4 select,
    .down-4 .txt5 {
        margin-top: 20px;
    }

    .down-4 textarea {
        margin-top: 20px;
    }

    .down-4bt {
        padding-top: 40px;
    }

    /*touzizhe*/
    .tz-1 {
        padding: 60px 0px;
    }

    .tz-1 iframe {
        width: 82% !important;
        height: 600px !important;
    }

    .tz-2 {
        padding: 60px 0px;
    }

    .tz-2 .h3 {
        font-size: 24px;
    }

    .tz-2 ul {
        margin-top: 20px;
    }

    .tz-2item a {
        padding: 15px;
    }

    .tz-2left {
        padding-right: 20px;
    }

    .tz-2left span {
        font-size: 24px;
    }

    .tz-3 {
        padding: 60px 0px;
    }

    .tz-3 .h3 {
        font-size: 24px;
    }

    /*server*/
    .server-1 .h3 {
        font-size: 24px;
    }

    .server-1item {
        margin-top: 12px;
    }

    .server-1icon span {
        font-size: 14px;
    }

    .server-2 {
        padding: 60px 0px;
    }

    .server-2center {
        padding: 0px 40px 0px 50px;
    }

    .server-2right .h3 {
        font-size: 24px;
    }

    .server-2info {
        line-height: 26px;
        font-size: 13px;
    }

    .server-2des {
        margin-top: 30px;
    }

    .server-3 {
        padding: 60px 0px;
    }

    .server-3 .h3 {
        font-size: 24px;
    }

    .server-3 ul li {
        height: 60px;
        line-height: 60px;
    }

    .server-4 {
        padding: 60px 0px;
    }

    .server-4 .h3 {
        font-size: 24px;
    }

    .server-4nav {
        margin-top: 30px;
    }

    .server-4more {
        margin: 50px auto 0px;
    }
}

@media screen and (max-width:1000px) {

    /*header*/
    .header {
        height: 50px;
        padding: 0px 5%;
        background: #fff;
        box-shadow: 0px 0px 12px 4px rgba(0, 0, 0, 0.04);
    }

    .header .logo {
        width: 160px;
    }

    .header .logo img {
        opacity: 0;
    }

    .header .logo img:last-child {
        opacity: 1;
    }

    .header-code {
        margin: 8px 0px 0px 12px;
        padding-left: 12px;
    }

    .header-code:before {
        background: #e5e5e5;
    }

    .header-code span {
        font-size: 12px;
        color: #999;
    }

    .header-code p {
        font-size: 14px;
        color: #222;
    }

    .header-lang {
        width: 100%;
        margin: 20px 0;
    }

    .header-lang span {
        display: block;
        float: none;
        width: 100%;
        height: auto;
        text-align: center;
    }

    .header-lang span a {
        color: #666;
    }

    .header-right {
        float: none;
        width: 100%;
        position: fixed;
        left: -100%;
        top: 50px;
        height: calc(100% - 50px);
        background: #fff;
        z-index: 1000;
        border-top: 1px #eee solid;
        box-sizing: border-box;
        overflow-y: auto;
        opacity: 1;
    }

    .search {
        width: 80%;
        height: auto;
        position: relative;
        background: none;
        opacity: 1;
        visibility: visible;
        margin: 20px auto 0px;
    }

    .search form {
        width: 100%;
        height: 40px;
        line-height: 40px;
        margin: 0px auto 0px;
        transform: translateY(0px);
        border: 1px #eee solid;
        border-radius: 20px;
        box-sizing: border-box;
    }

    .search form .txt {
        float: left;
        background: none;
        padding: 0px;
        padding-left: 20px;
    }

    .search form .bt {
        width: 40px;
        left: auto;
        right: 0px;
    }

    .search-close {
        display: none;
    }

    .header-right ul {
        float: none;
        width: 80%;
        height: auto;
        margin: 30px auto 0px;
        border-top: 1px #eee solid;
    }

    .header-right ul li {
        width: 100%;
        height: auto;
        margin-left: 0px;
        border-bottom: 1px #eee solid;
    }

    .header-right ul li em {
        width: 50px;
        height: 50px;
        position: absolute;
        right: 0px;
        top: 0px;
        z-index: 12;
        background: url("../images/icon-24.png") no-repeat center;
        background-size: 12px;
        transform: rotate(90deg);
        cursor: pointer;
    }

    .header-right ul li span {
        width: 100%;
        line-height: 50px;
    }

    .header-right ul li.icon span:before,
    .header-right ul li.icon span:after {
        display: none;
    }

    .header-right ul li span a {
        font-size: 14px;
        color: #333;
    }

    .header-right ul li.icon span {
        padding-right: 0px;
    }

    .header-right ul li.on span a {
        color: #006ab7;
    }

    .header-right ul li.open em {
        transform: rotate(180deg);
    }

    .header-search {
        display: none;
    }

    .sub-nav {
        float: left;
        width: 98%;
        position: relative;
        left: 0%;
        top: 0px;
        padding: 0px;
        opacity: 1;
        visibility: visible;
        transform: translateX(0%) scale(1);
        border-radius: 2px;
        margin: 0px 1% 4%;
        display: none;
        -webkit-transition: all 0s linear 0s;
        -moz-transition: all 0s linear 0s;
        -ms-transition: all 0s linear 0s;
        -o-transition: all 0s linear 0s;
        transition: all 0s linear 0s;
    }

    .sub-nav p {
        line-height: 30px;
        padding: 10px 0px;
    }

    .sub-nav p a {
        text-align: left;
        box-sizing: border-box;
        padding: 0px 20px;
    }

    .header-right ul li:nth-child(3) {
        position: relative;
    }

    .navs {
        float: left;
        width: 98%;
        position: relative;
        left: 0%;
        top: 0px;
        height: auto;
        opacity: 1;
        visibility: visible;
        transform: scale(1);
        border-radius: 2px;
        margin: 0px 1% 4%;
        display: none;
        -webkit-transition: all 0s linear 0s;
        -moz-transition: all 0s linear 0s;
        -ms-transition: all 0s linear 0s;
        -o-transition: all 0s linear 0s;
        transition: all 0s linear 0s;
    }

    .navs-left {
        width: 100%;
        height: auto;
        background: none;
    }

    .navs-ul {
        width: 100%;
        margin: 0px auto 0px;
        line-height: 30px;
        padding: 10px 0px;
    }

    .navs-li {
        line-height: 30px;
        height: 30px;
        margin-top: 0px;
        box-sizing: border-box;
        padding: 0px 20px;
        position: relative;
    }

    .navs-li:before {
        width: 0%;
        height: 100%;
        content: "";
        position: absolute;
        left: 0px;
        top: 0px;
        z-index: 2;
        background: #006ab7;
    }

    .navs-li p {
        font-size: 13px;
        margin-left: 0px;
        color: #222;
        position: relative;
        z-index: 12;
    }

    .navs-li em {
        display: none;
    }

    .navs-li:hover:before {
        width: 100%;
    }

    .navs-li:hover p {
        color: #fff;
    }

    .navs-right {
        display: none;
    }

    .header-right ul li.active .navs {
        opacity: 1;
        visibility: visible;
        transform: scale(1);
    }

    .subs {
        float: left;
        width: 98%;
        position: relative;
        left: 0%;
        top: 0px;
        height: auto;
        opacity: 1;
        visibility: visible;
        transform: scale(1);
        border-radius: 2px;
        margin: 0px 1% 4%;
        display: none;
        -webkit-transition: all 0s linear 0s;
        -moz-transition: all 0s linear 0s;
        -ms-transition: all 0s linear 0s;
        -o-transition: all 0s linear 0s;
        transition: all 0s linear 0s;
        border: none;
        padding-bottom: 0px;
    }

    .subs-center {
        width: 100%;
        margin: 0px auto 0px;
        display: block;
        padding: 10px 0px;
    }

    .subs-item {
        width: 100%;
        padding: 0px;
    }

    .subs-item:before {
        display: none;
    }

    .subs-item .em {
        line-height: 30px;
        height: 30px;
        margin-top: 0px;
        box-sizing: border-box;
        padding: 0px 20px;
        position: relative;
    }

    .subs-item .em:before {
        width: 0%;
        height: 100%;
        content: "";
        position: absolute;
        left: 0px;
        top: 0px;
        z-index: 2;
        background: #006ab7;
    }

    .subs-item .em a {
        float: left;
        width: 100%;
        color: #222;
        font-weight: normal;
        position: relative;
        z-index: 22;
        font-size: 13px;
    }

    .subs-item .em a:hover {
        transform: translateX(0px);
        color: #fff;
    }

    .subs-item .em:hover:before {
        width: 100%;
    }

    .subs-item p {
        display: none;
    }

    .header-right ul li.active .subs {
        opacity: 1;
        visibility: visible;
        transform: scale(1);
    }

    .menu {
        float: right;
        width: 24px;
        display: block;
        position: relative;
        z-index: 820;
        margin-top: 10px;
        cursor: pointer;
    }

    .menu span {
        float: left;
        width: 100%;
        height: 2px;
        background: #006ab7;
        margin-top: 6px;
        border-radius: 2px;
    }

    .header-slide .menu {
        margin-top: 15px;
    }

    .header-slide .menu span:nth-child(1) {
        transform: rotate(45deg) translateY(5px);
    }

    .header-slide .menu span:nth-child(2) {
        transform: rotate(-45deg) translateY(-6px);
    }

    .header-slide .menu span:nth-child(3) {
        display: none;
    }

    .header-slide .header-right {
        left: 0px;
        opacity: 1;
    }

    /*footer*/
    .footer {
        padding: 0px 5%;
    }

    .footer-1 {
        margin: 30px auto 0px;
    }

    .footer-1left em {
        font-size: 26px;
    }

    .footer-1right {
        margin-top: 0px;
    }

    .footer-2item {
        display: none;
    }

    .footer-2right {
        width: 100%;
        margin: 0 0 20px 0;
    }

    .footer-2right samp {
        width: 130px;
        margin: 0px auto;
    }

    .menu-pos {
        display: none;
    }

    /*home-banner*/
    .section {
        overflow: hidden;
    }

    .banner {
        height: auto;
        margin-top: 50px;
    }

    .banner img {
        width: 100%;
        height: auto;
    }

    .banner-ver {
        width: 100%;
        top: 50%;
        transform: translateY(-50%);
    }

    .banner-ver .h3 {
        font-size: 24px;
        line-height: 34px;
    }

    .banner-ver p {
        font-size: 16px;
        line-height: 24px;
        margin-top: 15px;
    }

    .banner-ver span {
        font-size: 22px;
        margin-top: 36px;
    }

    .banner-other {
        width: 90%;
        bottom: auto;
        left: 5%;
        top: 50%;
        transform: translate(0px, -50%);
    }

    .banner-other .swiper-button-prev {
        width: 60px;
        height: 60px;
        left: 0px;
        right: auto;
    }

    .banner-other .swiper-button-next {
        width: 60px;
        height: 60px;
        right: 0px;
    }

    .banner-other .swiper-pagination {
        display: none;
    }

    .banner-new {
        width: 100%;
        position: relative;
        left: 0px;
        bottom: 0px;
        height: 50px;
        line-height: 50px;
        margin: 0px auto 0px;
        border-radius: 0px;
    }

    .banner-title {
        width: 100px;
    }

    .banner-cont {
        width: calc(100% - 210px);
    }

    .banner-cont ul li a {
        font-size: 12px;
    }

    .banner-wz .h3 {
        font-size: 22px;
        line-height: 36px;
    }

    .banner-wz1 {
        margin-top: 14px;
    }

    .banner-wz1 span,
    .banner-wz1 p {
        line-height: 22px;
        font-size: 14px;
    }

    .banner-wz ul {
        margin-top: 18px;
        width: 380px;
    }

    .banner-wz ul li samp {
        margin-right: 10px;
    }

    .banner-wz ul li:last-child {
        margin-top: 20px;
    }

    .banner-detail {
        margin-top: 3vw;
    }

    /*home-about*/
    .habout {
        height: auto;
        overflow: hidden;
    }

    .habout-bg {
        position: relative;
        top: 0px;
        left: 0px;
        transform: translate(0px, 0px);
    }

    .habout-1 {
        width: 90%;
    }

    .habout-1 .h3 {
        font-size: 22px;
    }

    .habout-1info {
        font-size: 14px;
        line-height: 25px;
        margin-top: 10px;
        padding-bottom: 12px;
        width: 100%;
    }

    .habout-1info::before {
        height: 1px;
    }

    .habout-1des {
        width: 100%;
    }

    .habout-1more a {
        border-width: 1px;
    }

    .habout ul {
        width: 90%;
        left: 5%;
    }

    .habout-item {
        height: 70px;
    }

    .habout-item samp {
        height: 20px;
    }

    .habout-item p {
        height: 20px;
        font-size: 12px;
        line-height: 20px;
    }

    .habout-item p em {
        font-size: 20px;
    }

    .habout ul li:nth-child(5) p,
    .habout ul li:nth-child(6) p,
    .habout ul li:nth-child(7) p {
        font-size: 18px;
    }

    /*home-apply*/
    .section:nth-child(3) {
        margin-top: -1px;
    }

    .happ {
        height: auto;
    }

    .happ-bg span.active {
        position: relative;
    }

    .happ-content {
        height: calc(100% - 60px);
        top: 0px;
        width: 90%;
    }

    .happ-content .swiper-slide .h3 {
        font-size: 22px;
    }

    .happ-more a {
        border-width: 1px;
    }

    .happ ul {
        width: 100%;
        left: 0px;
        bottom: 1px;
    }

    .happ-item {
        height: 60px;
    }

    .happ-item samp {
        height: 20px;
    }

    .happ ul li,
    .happ ul li.active .happ-item {
        height: 80px;
    }

    .happ ul li.active .happ-item samp {
        height: 25px;
    }

    .happ ul li.active .happ-item span {
        font-size: 14px;
    }

    .happ ul li.active {
        flex: 1.4;
    }

    /*home-product*/
    .hpro {
        height: auto;
        padding: 40px 0px;
    }

    .hpro-center {
        width: 90%;
        left: 0px;
        top: 0px;
        transform: translate(0px, 0px);
        position: relative;
        margin: 0px auto;
    }

    .hpro-left {
        width: 100%;
    }

    .hpro-left .h3 {
        font-size: 22px;
    }

    .hpro-right {
        width: 100%;
        margin-top: 30px;
        transform: translateX(0px);
    }

    .hpro-button {
        display: none;
    }

    .hpro-bottom {
        margin-top: 3vw;
    }

    .hpro-nav span {
        font-size: 12px;
    }

    /*home-news*/
    .hnews {
        padding: 40px 0px;
    }

    .hnews-head {
        width: 90%;
    }

    .hnews-head .h3 {
        font-size: 22px;
    }

    .hnews-head .swiper-button-next {
        right: 0px;
        width: 22px;
        height: 22px;
    }

    .hnews-left {
        height: 40vw;
    }

    .hnews-cont {
        height: 23vw;
    }

    .hnews-center {
        height: 40vw;
    }

    .hnews-right {
        height: 40vw;
    }

    .hnews-left .swiper-pagination {
        top: 14vw;
    }

    .hnews-right span {
        font-size: 18px;
    }

    .hnews-info {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    .hnews-head .swiper-button {
        width: 28px;
        height: 28px;
        top: 0px;
    }

    /*home-pinpai*/
    .hpin {
        height: 90vh;
    }

    .hpin-1 {
        margin-top: 0px;
    }

    .hpin-3 .h3 {
        font-size: 22px;
    }

    .hpin-1 {
        width: 100vh;
        height: 100vh;
    }

    .hpin-2 {
        width: 80vh;
        height: 80vh;
    }

    .hpin-3 {
        width: 50vh;
        height: 50vh;
    }

    .hpin-2left {
        left: -33.4%;
    }

    .hpin-2right {
        right: -30.6%;
    }

    /*news*/
    .banner-news {
        margin-top: 50px;
    }

    .banner-center,
    .bread-nav ul,
    .news-center {
        width: 90%;
    }

    .banner-center .h3 {
        font-size: 22px;
    }

    .bread-nav ul li {
        padding: 0px 18px;
    }

    .bread-nav ul li a {
        padding: 0px 5px;
    }

    .bread-nav ul li a::before {
        height: 2px;
    }

    .news {
        padding-bottom: 50px;
    }

    .news-form {
        padding: 20px 0px;
    }

    .news-form label {
        font-size: 14px;
    }

    .news-input {
        width: 28vw;
        padding: 0px 12px;
        height: 36px;
        line-height: 36px;
    }

    .news-right span {
        margin-top: 3px;
        width: 80px;
    }

    .news-1 p {
        font-size: 16px;
        padding: 0px 20px;
    }

    .news-item {
        padding: 30px 0px;
    }

    .news-item samp {
        width: 260px;
        height: 169px;
    }

    .news-model {
        width: calc(100% - 300px);
    }

    .news-model span {
        font-size: 18px;
    }

    .news-model em {
        margin-top: 18px;
    }

    /*news-info*/
    .detail {
        padding: 50px 0px;
    }

    .detail-center {
        padding: 40px;
        width: 90%;
    }

    .detail-center .h1 {
        font-size: 20px;
    }

    .detail-time em {
        position: relative;
        left: 0px;
        margin-left: 20px;
    }

    .detail-content {
        margin-top: 30px;
    }

    .detail-content p {
        margin-bottom: 16px;
    }

    .detail-page {
        margin-top: 40px;
    }

    /*video*/
    .vd-1 span {
        height: 36px;
        line-height: 36px;
        width: 90px;
        margin-right: 12px;
    }

    .vd-1 span a {
        font-size: 14px;
    }

    .vd-list {
        padding-bottom: 30px;
        width: 90%;
    }

    .vd-item {
        margin: 25px 2% 0px 0px;
    }

    .vd-bottom {
        margin-top: 12px;
    }

    .vd-bottom span {
        font-size: 14px;
    }

    .vd-bottom p {
        margin-top: 2px;
        font-size: 14px;
    }

    /*about-company*/
    .about-1 {
        padding: 50px 0px;
    }

    .about-1 .h3 {
        font-size: 20px;
        padding-bottom: 12px;
    }

    .about-1 .h3:before {
        width: 40px;
        height: 2px;
    }

    .about-1content {
        width: 90%;
    }

    .about-1content .h4 {
        font-size: 18px;
        padding-bottom: 12px;
    }

    .about-1content .h4:before {
        width: 50px;
        height: 2px;
    }

    .about-1video {
        float: left;
        width: 100%;
        margin-top: 30px;
    }

    .about-1info {
        width: 100%;
        margin-top: 30px;
    }

    .about-1 ul {
        margin: 40px auto 0px;
        width: 90%;
    }

    .about-1 ul li samp {
        width: 26px;
        height: 26px;
        padding-right: 15px;
    }

    .about-1item {
        padding-left: 15px;
    }

    .about-1item span em {
        font-size: 26px;
    }

    .about-1item span {
        font-size: 14px;
    }

    .about-1 ul li:nth-child(3) .about-1item span,
    .about-1 ul li:nth-child(4) .about-1item span {
        font-size: 20px;
    }

    .about-1 ul li p {
        font-size: 12px;
    }

    .about-2 {
        height: 370px;
    }

    .about-2 .h3 {
        font-size: 34px;
        margin-top: 90px;
    }

    .about-3 {
        padding-top: 50px;
    }

    .about-3 .h3 {
        font-size: 20px;
        padding-bottom: 12px;
    }

    .about-3 .h3:before {
        width: 40px;
        height: 2px;
    }

    .about-3content {
        margin: 25px auto 0px;
        width: 90%;
    }

    .about-3item {
        height: 320px;
    }

    .about-3center span {
        font-size: 16px;
    }

    .about-3center p {
        font-size: 12px;
    }

    .about-3item.active .about-3center span {
        font-size: 22px;
    }

    .about-4 {
        padding: 50px 0px;
        margin-top: 50px;
    }

    .about-4 .h3 {
        font-size: 20px;
        padding-bottom: 12px;
    }

    .about-4nav {
        width: 90%;
        margin: 30px auto 0px;
    }

    .about-4nav .about-4model span {
        font-size: 16px;
    }

    .about-4nav .about-4model p {
        font-size: 15px;
    }

    .about-4content {
        margin-top: 40px;
    }

    .about-4content .swiper-container {
        width: 90%;
    }

    .about-4date {
        font-size: 50px;
    }

    .about-4li {
        min-height: 50px;
    }

    .about-4content .swiper-button-prev {
        width: 40px;
        height: 40px;
        left: 5%;
    }

    .about-4content .swiper-button-next {
        width: 40px;
        height: 40px;
        right: 5%;
    }

    .about-5 .h3 {
        font-size: 20px;
        padding-bottom: 12px;
    }

    .about-5 .h3:before {
        width: 40px;
        height: 2px;
    }

    .about-5content {
        margin: 30px auto 0px;
        width: 90%;
    }

    .about-5item span {
        padding: 0px;
        margin-top: 10px;
    }

    .about-5top {
        height: 20vw;
    }

    .about-5 ul {
        margin-top: 40px;
    }

    .about-5 ul li {
        margin: 0px 12px;
        width: 170px;
        height: 48px;
        line-height: 48px;
    }

    .about-5pannel .swiper-button-prev {
        width: 36px;
        height: 36px;
        left: -34px;
        background-size: 10px;
        opacity: 0.6;
    }

    .about-5pannel .swiper-button-next {
        width: 36px;
        height: 36px;
        right: -34px;
        background-size: 10px;
        opacity: 0.6;
    }

    /*about-keji*/
    .kj-1 {
        margin: 50px auto 0px;
        width: 90%;
    }

    .kj-1 .h3 {
        font-size: 20px;
        padding-bottom: 12px;
    }

    .kj-1 .h3:before {
        width: 40px;
        height: 2px;
    }

    .kj-1info {
        font-size: 14px;
        width: 100%;
    }

    .kj-2 {
        padding-bottom: 50px;
        width: 90%;
    }

    .kj-pannel {
        margin-top: 30px;
        padding-bottom: 20px;
    }

    .kj-center p {
        font-size: 22px;
    }

    .kj-center span img {
        height: 40px;
    }

    .kj-2 ul {
        width: 100%;
    }

    .kj-2 ul li p {
        line-height: 24px;
        font-size: 13px;
    }

    /*about-join*/
    .join {
        padding: 60px 0px;
    }

    .join .h3 {
        font-size: 20px;
        padding-bottom: 12px;
    }

    .join .h3:before {
        width: 40px;
        height: 2px;
    }

    .join-content {
        margin: 25px auto 0px;
        width: 90%;
    }

    .join-center span {
        height: 40px;
    }

    .join-center p {
        font-size: 20px;
    }

    /*about-contact*/
    .contact {
        padding: 50px 0px;
    }

    .contact .h3 {
        font-size: 20px;
        padding-bottom: 12px;
    }

    .contact .h3:before {
        width: 40px;
        height: 2px;
    }

    .contact-1 {
        margin: 30px auto 0px;
        width: 90%;
    }

    .contact-1ver {
        left: 30px;
        bottom: 30px;
    }

    .contact-1ver span {
        font-size: 20px;
    }

    .contact-1ver p {
        font-size: 14px;
        background-size: 16px;
        padding-left: 23px;
        margin-top: 15px;
    }

    .contact-2,
    .contact-3 {
        width: 90%;
    }

    .contact-2cont span {
        font-size: 20px;
    }

    .contact-2info {
        font-size: 14px;
        margin-top: 30px;
    }

    /*about-join-boshi*/
    .join-boshi {
        padding: 50px 0px;
    }

    .join-boshi .h3 {
        font-size: 20px;
        padding-bottom: 12px;
    }

    .join-boshi .h3:before {
        width: 40px;
        height: 2px;
    }

    .join-1 {
        width: 90%;
    }

    .join-1info {
        line-height: 27px;
        font-size: 14px;
        margin-top: 24px;
    }

    .join-1info p {
        margin-top: 14px;
    }

    .join-2 {
        width: 90%;
    }

    .join-2content {
        margin-top: 20px;
    }

    .join-2item {
        margin-top: 20px;
    }

    .join-2right {
        width: 69%;
    }

    .join-2right span {
        font-size: 18px;
    }

    .join-2right p {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    .join-2right em {
        margin-top: 1.4vw;
    }

    .join-boshi .news-page {
        margin-top: 60px;
    }

    /*about-join-zhaoxian*/
    .zx {
        padding: 60px 0px;
    }

    .zx .h3 {
        font-size: 20px;
        padding-bottom: 12px;
    }

    .zx .h3:before {
        width: 40px;
        height: 2px;
    }

    .zx-nav span {
        margin: 0px 10px;
        width: 170px;
        height: 48px;
        line-height: 48px;
    }

    .zx-nav span a {
        font-size: 14px;
    }

    .zx-1 {
        width: 90%;
    }

    .zx-1item select {
        font-size: 14px;
        padding: 0px 50px;
    }

    .zx-1item::after {
        right: 25px;
    }

    .zx-1item:nth-child(1)::before {
        background-size: 20px;
        left: 20px;
    }

    .zx-1item:nth-child(2)::before {
        background-size: 20px;
        left: 18px;
    }

    .zx-2 {
        width: 90%;
        margin-top: 10px;
    }

    .zx-2left span {
        font-size: 16px;
    }

    .zx-2right {
        width: 36px;
    }

    .zx .news-page {
        margin-top: 50px;
    }

    /*about-join-zhaoxian-detail*/
    .zx-detail {
        padding: 50px 0px;
        width: 90%;
    }

    .zp-1ver span {
        font-size: 24px;
    }

    .zp-2item .txt2,
    .zp-2item select,
    .zp-2item .txt3 {
        margin-top: 20px;
        height: 40px;
        line-height: 40px;
        font-size: 14px;
    }

    .zp-2item .txt2::placeholder {
        color: #666 !important;
        opacity: 1;
    }

    .zp-2item .txt2::-webkit-input-placeholder {
        color: #666 !important;
        opacity: 1;
    }

    .zp-2item .txt2::-ms-input-placeholder {
        color: #666 !important;
        opacity: 1;
    }

    .zp-2item .txt2::-moz-placeholder {
        color: #666 !important;
        opacity: 1;
    }

    .zp-2item .txt3::placeholder {
        color: #666 !important;
        opacity: 1;
    }

    .zp-2item .txt3::-webkit-input-placeholder {
        color: #666 !important;
        opacity: 1;
    }

    .zp-2item .txt3::-ms-input-placeholder {
        color: #666 !important;
        opacity: 1;
    }

    .zp-2item .txt3::-moz-placeholder {
        color: #666 !important;
        opacity: 1;
    }

    .zp-2des {
        margin-top: 70px;
    }

    .zp-5 {
        margin-top: 30px;
    }

    .zp-5 input {
        height: 40px;
        line-height: 40px;
        font-size: 14px;
    }

    /*solve*/
    .solve-nav {
        height: 60px;
    }

    .solve-nav ul li samp {
        height: 20px;
    }

    .solve-nav ul li span {
        font-size: 12px;
        margin-top: 3px;
    }

    .solve-1 {
        width: 90%;
        margin: 50px auto 0px;
    }

    .solve-1 .h3 {
        font-size: 20px;
        padding-bottom: 12px;
    }

    .solve-1 .h3:before {
        width: 40px;
        height: 2px;
    }

    .solve-1info {
        margin-top: 20px;
    }

    .solve-2 {
        width: 90%;
        margin: 50px auto 0px;
        padding-bottom: 50px;
    }

    .solve-2 .h3 {
        font-size: 20px;
        padding-bottom: 12px;
    }

    .solve-2 .h3:before {
        width: 40px;
        height: 2px;
    }

    .solve-2right span {
        font-size: 18px;
    }

    .solve-2info {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
    }

    .solve-2more em {
        width: 110px;
        height: 36px;
        line-height: 36px;
    }

    .solve-3 {
        padding: 50px 0px;
    }

    .solve-3 .h3 {
        font-size: 20px;
        padding-bottom: 12px;
    }

    .solve-3 .h3:before {
        width: 40px;
        height: 2px;
    }

    .solve-3content {
        width: 90%;
        margin-top: 25px;
    }

    .solve-3content .swiper-slide span {
        height: 40px;
        line-height: 40px;
        font-size: 12px;
    }

    .solve-3content .swiper-slide samp {
        height: 25vw;
    }

    .solve-3content .swiper-button-prev {
        width: 36px;
        height: 36px;
        left: -40px;
        background-size: 10px;
    }

    .solve-3content .swiper-button-next {
        width: 36px;
        height: 36px;
        right: -40px;
        background-size: 10px;
    }

    /*solve-detail*/
    .bread-crumb {
        margin-top: 50px;
        height: 40px;
        line-height: 40px;
    }

    .bread-center {
        width: 90%;
    }

    .bread-center a {
        margin: 0px 6px;
    }

    .solve-4 {
        width: 90%;
        flex-wrap: wrap;
    }

    .solve-4left {
        width: 100%;
    }

    .solve-4right {
        width: 100%;
        margin-top: 30px;
    }

    .solve-4right .h3 {
        font-size: 20px;
    }

    .solve-5 {
        margin-top: 10px;
    }

    .solve-5 ul {
        width: 90%;
    }

    .solve-5 ul li {
        width: 49%;
    }

    .solve-5 ul li:nth-child(3n) {
        margin-right: 2%;
    }

    .solve-5 ul li:nth-child(2n) {
        margin-right: 0px;
    }

    .solve-6 ul {
        width: 90%;
    }

    .solve-7pannel {
        width: 90%;
        padding: 40px 0px;
    }

    .solve-7content {
        margin-top: 20px;
    }

    .solve-7pannel .h4 {
        font-size: 18px;
    }

    /*product*/
    .product {
        width: 90%;
    }

    .pro-left {
        width: 290px;
        top: calc(50px + 20px);
    }

    .pro-center {
        width: 270px;
    }

    .pro-title {
        height: 50px;
        line-height: 50px;
    }

    .pro-title span {
        font-size: 15px;
        padding-left: 15px;
        line-height: 20px;
    }

    .pro-title a {
        padding: 0px 10px;
    }

    .pro-title span::before {
        width: 7px;
        height: 7px;
    }

    .pro-right {
        width: calc(100% - 310px);
    }

    .pro-form form {
        padding: 0px 14px;
    }

    .pro-form .txt3 {
        font-size: 14px;
    }

    .pro-name {
        font-size: 18px;
        padding-bottom: 12px;
    }

    .pro-name:before {
        width: 40px;
        height: 2px;
    }

    .pro-li {
        width: 49%;
        margin-top: 20px;
    }

    .pro-li:nth-child(3n) {
        margin-right: 2%;
    }

    .pro-li:nth-child(2n) {
        margin-right: 0px;
    }

    .pro-li samp {
        height: 20vw;
    }

    /*product-info*/
    .pro-1 {
        padding: 50px 0px;
    }

    .pro-1center {
        width: 90%;
        display: block;
    }

    .pro-1right {
        width: 100%;
        float: left;
    }

    .pro-1left {
        width: 100%;
        margin-top: 30px;
        float: left;
    }

    .pro-1left .h3 {
        font-size: 20px;
    }

    .pro-1cont {
        height: 28vw;
    }

    .pro-1nav {
        height: 28vw;
    }

    .pro-2 {
        margin-top: 20px;
    }

    .pro-2 ul {
        width: 90%;
    }

    .pro-3td,
    .pro-3app {
        padding: 40px 0px;
        width: 90%;
    }

    .pro-3pannel ul li {
        width: 100%;
        margin-top: 10px;
    }

    .pro-3rel {
        margin: 40px auto;
        width: 90%;
    }

    .pro-3des {
        margin-top: 30px;
    }

    .pro-3right {
        transform: translateX(-63%);
    }

    .pro-3rel span {
        line-height: 20px;
        font-size: 12px;
    }

    .pro-3rel .swiper-button-prev {
        width: 36px;
        height: 36px;
        left: -40px;
        background-size: 10px;
    }

    .pro-3rel .swiper-button-next {
        width: 36px;
        height: 36px;
        right: -40px;
        background-size: 10px;
    }

    .pro-3video {
        width: 90%;
        margin: 40px auto;
    }

    .pro-3item span {
        font-size: 14px;
        margin-top: 16px;
    }

    .pro-3item p {
        font-size: 14px;
        margin-top: 3px;
    }

    .pro-3video .swiper-button-prev {
        width: 36px;
        height: 36px;
        left: -40px;
        background-size: 10px;
    }

    .pro-3video .swiper-button-next {
        width: 36px;
        height: 36px;
        right: -40px;
        background-size: 10px;
    }

    /*download*/
    .down-1 {
        padding: 30px 0px;
    }

    .down-1 form {
        width: 90%;
        padding: 0px 16px;
        height: 40px;
        line-height: 40px;
    }

    .down-1 .txt4 {
        font-size: 14px;
    }

    .down-1 .bt4 {
        background-size: 20px;
    }

    .down-1cont {
        width: 90%;
    }

    .down-1icon span {
        font-size: 13px;
        margin-left: 8px;
    }

    .down-1icon samp {
        width: 16px;
    }

    .down-1icon {
        width: 18%;
    }

    .down-1icon:nth-child(7n) {
        margin-right: 1.5%;
    }

    .down-1icon:nth-child(5n) {
        margin-right: 0px;
    }

    .down-2 .h3 {
        font-size: 20px;
        margin-top: 50px;
        padding-bottom: 12px;
    }

    .down-2 .h3:before {
        width: 40px;
        height: 2px;
    }

    .down-2content {
        width: 90%;
    }

    .down-3content {
        padding-bottom: 50px;
        margin: 20px auto 0px;
        width: 90%;
    }

    .down-3item span {
        font-size: 14px;
        padding: 15px 5px;
    }

    .down-3content .swiper-button-prev {
        width: 36px;
        height: 36px;
        left: -40px;
        background-size: 10px;
        margin-top: -50px;
    }

    .down-3content .swiper-button-next {
        width: 36px;
        height: 36px;
        right: -40px;
        background-size: 10px;
        margin-top: -50px;
    }

    .down-4 {
        padding: 50px 0px;
    }

    .down-4 .h3 {
        font-size: 20px;
        padding-bottom: 12px;
    }

    .down-4 .h3:before {
        width: 40px;
        height: 2px;
    }

    .down-4 form {
        width: 90%;
        margin-top: 10px;
    }

    .down-4bt {
        padding-top: 30px;
    }

    /*touzizhe*/
    .tz-1 {
        padding: 50px 0px;
    }

    .tz-1 iframe {
        width: 90% !important;
        height: 600px !important;
    }

    .tz-2 {
        padding: 50px 0px;
    }

    .tz-2 .h3 {
        font-size: 20px;
        padding-bottom: 12px;
    }

    .tz-2 .h3:before {
        width: 40px;
        height: 2px;
    }

    .tz-2content {
        width: 90%;
    }

    .tz-2 ul {
        margin-top: 10px;
    }

    .tz-2item a {
        padding: 12px;
    }

    .tz-2left {
        padding-right: 18px;
    }

    .tz-2left span {
        font-size: 20px;
    }

    .tz-3 {
        padding: 50px 0px;
    }

    .tz-3 .h3 {
        font-size: 20px;
        padding-bottom: 12px;
    }

    .tz-3 .h3:before {
        width: 40px;
        height: 2px;
    }

    .tz-3content,
    .tz-map {
        width: 90%;
    }

    /*server*/
    .server-1 {
        padding: 50px 0px;
    }

    .server-1 .h3 {
        font-size: 20px;
        padding-bottom: 12px;
    }

    .server-1 .h3:before {
        width: 40px;
        height: 2px;
    }

    .server-1center {
        width: 90%;
    }

    .server-2 {
        padding: 50px 0px;
    }

    .server-2center {
        padding: 0px;
    }

    .server-2right .h3 {
        font-size: 20px;
        padding-bottom: 12px;
    }

    .server-2right .h3:before {
        width: 40px;
        height: 2px;
    }

    .server-2info {
        line-height: 25px;
        font-size: 12px;
    }

    .server-2des {
        margin-top: 20px;
    }

    .server-3 {
        padding: 50px 0px;
    }

    .server-3 .h3 {
        font-size: 20px;
        padding-bottom: 12px;
    }

    .server-3 .h3:before {
        width: 40px;
        height: 2px;
    }

    .server-3 .down-3content {
        margin-top: 10px;
    }

    .server-3 ul {
        width: 90%;
    }

    .server-4 {
        padding: 50px 0px;
    }

    .server-4 .h3 {
        font-size: 20px;
        padding-bottom: 12px;
    }

    .server-4 .h3:before {
        width: 40px;
        height: 2px;
    }

    .server-4content {
        width: 90%;
    }

    .server-4more {
        margin: 40px auto 0px;
    }

    .server-4item span {
        font-size: 14px;
    }

    .new-bread .bread-center {
        width: 90%;
    }

    .right-float {
        display: none;
    }
}

@media screen and (max-width:768px) {
    .header-code p {
        font-size: 13px;
    }

    /*footer*/
    .footer-1right {
        display: none;
    }

    .footer-3 {
        padding: 15px 0px;
    }

    .footer-3 ul li {
        margin-right: 15px;
    }

    .footer-3 ul li:last-child {
        margin-right: 0px;
    }

    .footer-3 ul li a {
        font-size: 12px;
    }

    .footer-3 p {
        width: 100%;
        margin-top: 5px;
    }

    .footer-3 p span {
        margin: 0px 14px 0px 0px;
        font-size: 12px;
    }

    .footer-form {
        width: 100%;
        margin-left: 0vw;
        margin-top: 30px;
    }

    .footer-form span {
        font-size: 16px;
    }

    .footer-form form {
        height: 32px;
        line-height: 32px;
        margin-top: 12px;
        box-sizing: border-box;
    }

    /*home-banner*/
    .banner-ver .h3 {
        font-size: 16px;
        line-height: 22px;
    }

    .banner-ver p {
        display: none;
    }

    .banner-ver span {
        font-size: 14px;
        margin-top: 16px;
    }

    .banner-other .swiper-button-prev {
        display: none;
    }

    .banner-other .swiper-button-next {
        display: none;
    }

    .banner-other .swiper-pagination {
        display: block;
        width: 100%;
        right: 0px;
    }

    .banner-other .swiper-pagination span {
        margin: 0px 4px;
        background: #006ab7;
    }

    .banner-other {
        bottom: 36px;
        left: 5%;
        top: auto;
        transform: translate(0px, 0%);
        top: auto;
    }

    .banner-wz .h3 {
        font-size: 18px;
        line-height: 26px;
    }

    .banner-wz1 {
        margin-top: 10px;
    }

    .banner-wz1 span,
    .banner-wz1 p {
        line-height: 20px;
        font-size: 12px;
    }

    .banner-wz ul {
        display: none;
    }

    .banner-detail a {
        width: 90px;
        height: 32px;
        line-height: 32px;
        border-width: 1px;
    }

    .banner-detail a span {
        font-size: 12px;
    }

    .banner-detail span:before {
        background-size: 6px;
    }

    .banner-detail span:after {
        background-size: 6px;
    }

    /*home-about*/
    .habout {
        height: auto;
        overflow: hidden;
    }

    .habout-bg {
        position: absolute;
    }

    .habout-1 {
        position: relative;
        margin: 30px auto 0px;
        left: 0px;
        top: 0px;
        transform: translateX(0px);
        overflow: hidden;
    }

    .habout-1 .h3 {
        font-size: 18px;
    }

    .habout ul {
        width: 100%;
        left: 0px;
        position: relative;
        margin-top: 30px;
        flex-wrap: wrap;
    }

    .habout ul li {
        flex: auto;
        width: 30%;
        margin-top: 1px;
    }

    .habout ul li:first-child,
    .habout ul li:last-child {
        border-radius: 0px;
    }

    .habout-item {
        height: 60px;
    }

    /*home-apply*/
    .happ-bg {
        position: absolute;
        left: 0px;
        top: 0px;
    }

    .happ-content {
        position: relative;
        margin: 30px auto 0px;
        left: 0px;
        padding-bottom: 120px;
        overflow: hidden;
    }

    .happ-content .swiper-slide .h3 {
        font-size: 18px;
    }

    .happ-info {
        width: 100%;
    }

    .happ ul {
        display: none;
    }

    .happ .swiper-button-prev {
        width: 36px;
        height: 36px;
        border: 1px rgba(255, 255, 255, 0.6) solid;
        border-radius: 50%;
        top: auto;
        bottom: 30px;
        left: 30%;
        background: url("../images/icon-59.png") no-repeat center;
        background-size: 10px;
    }

    .happ .swiper-button-next {
        width: 36px;
        height: 36px;
        border: 1px rgba(255, 255, 255, 0.6) solid;
        border-radius: 50%;
        top: auto;
        bottom: 30px;
        right: 30%;
        background: url("../images/icon-59.png") no-repeat center;
        background-size: 10px;
        transform: rotate(180deg);
    }

    .happ .swiper-button-prev:hover,
    .happ .swiper-button-next:hover {
        background-color: #006ab7;
    }

    /*home-product*/
    .hpro-left .h3 {
        font-size: 18px;
    }

    .hpro-left ul {
        width: 100%;
    }

    .hpro-left ul li span {
        font-size: 12px;
    }

    .hpro-nav em {
        display: none;
    }

    .hpro-ul {
        margin-top: 10px;
    }

    .hpro-li {
        width: 100%;
    }

    .hpro-li:before {
        top: 9px;
    }

    .hpro-li a {
        font-size: 12px;
        line-height: 22px;
    }

    .hpro-top .swiper-slide:nth-child(3) .hpro-li,
    .hpro-top .swiper-slide:nth-child(4) .hpro-li {
        width: 50%;
    }

    /*home-news*/
    .hnews {
        padding: 30px 0px;
        height: auto;
    }

    .hnews-head .h3 {
        font-size: 18px;
    }

    .hnews-content {
        width: 90%;
        display: block;
    }

    .hnews-left {
        width: 100%;
        height: auto;
        margin-top: 20px;
        overflow: hidden;
        float: left;
    }

    .hnews-pic {
        height: 48.708vw;
    }

    .hnews-left .swiper-pagination {
        top: 40vw;
    }

    .hnews-cont {
        height: 50vw;
    }

    .hnews-center {
        width: 100%;
        margin-top: 20px;
        overflow: hidden;
        float: left;
        height: auto;
    }

    .hnews-model {
        height: 100px;
        margin-top: 10px;
    }

    .hnews-right {
        float: left;
        width: 100%;
        margin-top: 20px;
        height: auto;
    }

    .hnews-head .swiper-button {
        width: 24px;
        height: 24px;
        background-size: 12px;
    }

    /*home-pinpai*/
    .hpin-3 samp {
        margin-top: 5vw;
    }

    .hpin-3 samp img {
        height: 6vh;
    }

    .hpin-3 .h3 {
        font-size: 20px;
    }

    .hpin-1 {
        width: 70vh;
        height: 70vh;
    }

    .hpin-2 {
        width: 50vh;
        height: 50vh;
    }

    .hpin-3 {
        width: 30vh;
        height: 30vh;
    }

    .hpin-2left,
    .hpin-2right {
        display: none;
    }

    .hpin {
        height: 66vh;
    }

    /*news*/
    .banner-center .h3 {
        font-size: 18px;
    }

    .bread-nav {
        display: none;
    }

    .news-input {
        width: 77vw;
    }

    .news-right {
        margin-left: 0vw;
    }

    .news-right span {
        width: 75px;
    }

    .news {
        padding-bottom: 50px;
    }

    .news-top {
        display: block;
        margin-top: 20px;
        width: 90%;
    }

    .news-1 {
        width: 100%;
        height: 44vw;
        margin-top: 15px;
    }

    .news-1 p {
        font-size: 14px;
        padding: 0px 15px;
    }

    .news-list {
        width: 90%;
    }

    .news-item {
        padding: 20px 0px !important;
    }

    .news-item samp {
        width: 150px;
        height: 98px;
    }

    .news-model {
        width: calc(100% - 165px);
    }

    .news-model span {
        font-size: 15px;
    }

    .news-model p {
        font-size: 12px;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        min-height: auto;
        margin-top: 6px;
        line-height: 20px;
    }

    .news-model em {
        margin-top: 10px;
    }

    .news-page {
        margin-top: 20px;
    }

    .news-page a {
        margin: 0px 2px;
        height: 24px;
        padding: 0px 8px;
        line-height: 24px;
        font-size: 12px;
    }

    /*news-info*/
    .detail {
        padding: 30px 0px;
    }

    .detail-center {
        padding: 20px;
    }

    .detail-center .h1 {
        font-size: 17px;
    }

    .detail-time {
        font-size: 12px !important;
    }

    .detail-content {
        font-size: 14px;
    }

    .detail-page {
        margin-top: 30px;
    }

    .detail-page span {
        font-size: 13px;
    }

    /*video*/
    .news-form.vd {
        margin-top: 30px;
    }

    .vd-1 {
        margin-bottom: 15px;
    }

    .vd-1 span {
        height: 30px;
        line-height: 30px;
        width: 80px;
        margin-right: 8px;
    }

    .vd-1 span a {
        font-size: 12px;
    }

    .vd-list {
        padding-bottom: 30px;
        width: 90%;
    }

    .vd-item {
        width: 49%;
        margin: 20px 2% 0px 0px;
    }

    .vd-item:nth-child(3n) {
        margin-right: 2%;
    }

    .vd-item:nth-child(2n) {
        margin-right: 0px;
    }

    .vd-top {
        height: 26.62vw;
    }

    .vd-top span {
        width: 9vw;
        height: 9vw;
    }

    /*about-company*/
    .about-1 {
        padding: 30px 0px;
    }

    .about-1 .h3 {
        font-size: 18px;
    }

    .about-1content {
        margin-top: 20px;
    }

    .about-1content .h4 {
        font-size: 16px;
        width: 100%;
    }

    .about-1video {
        margin-top: 20px;
        height: auto;
    }

    .about-1info {
        margin-top: 20px;
    }

    .about-1 ul {
        margin: 30px auto 0px;
    }

    .about-1 ul li {
        width: auto;
        flex-wrap: wrap;
    }

    .about-1 ul li samp {
        width: 100%;
        height: 20px;
        padding-right: 0px;
        display: block;
        text-align: center;
    }

    .about-1 ul li samp img {
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .about-1item {
        padding-left: 0px;
        width: 100%;
    }

    .about-1item::before {
        display: none;
    }

    .about-1item span {
        width: 100%;
        display: block;
        text-align: center;
    }

    .about-1item span em {
        font-size: 20px;
    }

    .about-1 ul li p {
        text-align: center;
    }

    .about-2 {
        height: 200px;
    }

    .about-2 .h3 {
        font-size: 24px;
        margin-top: 60px;
        padding: 0 20px;
        white-space: normal;
        box-sizing: border-box;
    }

    .about-3 {
        padding-top: 30px;
    }

    .about-3 .h3 {
        font-size: 18px;
    }

    .about-3content {
        margin: 20px auto 0px;
    }

    .about-3item {
        height: 270px;
    }

    .about-3center span {
        font-size: 14px;
        width: 23px;
        margin: 0px auto;
    }

    .about-3item.active .about-3center span {
        font-size: 18px;
        width: 100%;
    }

    .about-3item.active .about-3center p {
        line-height: 20px;
        margin-top: 8px;
        max-height: 200px;
    }

    .about-4 {
        padding: 30px 0px;
        margin-top: 30px;
    }

    .about-4 .h3 {
        font-size: 18px;
    }

    .about-4nav::before,
    .about-4line {
        top: 34px;
    }

    .about-4left,
    .about-4right {
        width: 20px;
        height: 20px;
        top: 25px;
    }

    .about-4nav {
        margin: 20px auto 0px;
    }

    .about-4nav .about-4model span {
        font-size: 14px;
    }

    .about-4nav .about-4model p {
        font-size: 14px;
    }

    .about-4nav .about-4model em,
    .about-4nav .about-4model p {
        margin-top: 4px;
    }

    .about-4content {
        margin-top: 20px;
    }

    .about-4pic {
        width: 100%;
        height: auto;
        position: relative;
        top: 0%;
        transform: translateY(0%);
    }

    .about-4pic img {
        height: auto;
    }

    .about-4item {
        width: 100%;
        float: none;
        height: 300px;
    }

    .about-4date {
        font-size: 40px;
        left: auto;
        right: 20px;
    }

    .about-4list {
        width: 90%;
        height: 90%;
        margin: 0px auto;
    }

    .about-4li {
        min-height: inherit;
    }

    .about-4li p {
        line-height: 24px;
        font-size: 14px;
    }

    .about-4li::before {
        top: 7px;
    }

    .about-4content .swiper-button-prev {
        left: 7%;
        top: 25%;
        opacity: 0.6;
    }

    .about-4content .swiper-button-next {
        right: 7%;
        top: 25%;
        opacity: 0.6;
    }

    .about-5 {
        padding: 30px 0px;
    }

    .about-5 .h3 {
        font-size: 18px;
    }

    .about-5content {
        margin: 20px auto 0px;
    }

    .about-5top {
        height: 80vw;
    }

    .about-5 ul {
        margin-top: 30px;
    }

    .about-5 ul li {
        margin: 0px 5px;
        width: 120px;
        height: 36px;
        line-height: 36px;
    }

    .about-5pannel .swiper-button-prev {
        left: 15px;
    }

    .about-5pannel .swiper-button-next {
        right: 15px;
    }

    /*about-keji*/
    .kj-1 {
        margin: 30px auto 0px;
    }

    .kj-1 .h3 {
        font-size: 18px;
    }

    .kj-2 {
        padding-bottom: 30px;
    }

    .kj-pannel {
        margin-top: 30px;
        padding-bottom: 20px;
    }

    .kj-center {
        top: 50%;
        transform: translateY(-50%);
        display: flex;
        align-items: center;
    }

    .kj-center p {
        font-size: 18px;
        margin-top: 0px;
        margin-left: 20px;
    }

    .kj-center span {
        width: 40px;
        display: block;
    }

    .kj-center span img {
        height: 30px;
    }

    .kj-2 ul {
        width: 100%;
    }

    .kj-2 ul li {
        width: 100%;
        margin-top: 10px;
    }

    .kj-2 ul li em {
        width: 30px;
        height: 30px;
    }

    .kj-2 ul li p {
        line-height: 22px;
        font-size: 12px;
        width: calc(100% - 43px);
    }

    .kj-2 ul li:nth-child(2n) {
        width: 100%;
    }

    /*about-join*/
    .join {
        padding: 30px 0px;
    }

    .join .h3 {
        font-size: 18px;
    }

    .join-content {
        margin: 20px auto 0px;
    }

    .join-item {
        width: 100%;
    }

    .join-center {
        top: 50%;
        transform: translateY(-50%);
    }

    .join-center span {
        height: 36px;
    }

    .join-center p {
        font-size: 18px;
    }

    /*about-contact*/
    .contact {
        padding: 30px 0px;
    }

    .contact .h3 {
        font-size: 18px;
    }

    .contact-1 {
        margin: 20px auto 0px;
    }

    .contact-1ver {
        left: 15px;
        bottom: 15px;
    }

    .contact-1ver span {
        font-size: 16px;
    }

    .contact-1ver p {
        font-size: 12px;
        background-size: 14px;
        padding-left: 20px;
        margin-top: 10px;
        line-height: 22px;
    }

    .contact-2,
    .contact-3 {
        margin-top: 0px;
    }

    .contact-2item {
        margin-top: 15px;
        width: 100%;
        height: auto;
    }

    .contact-2cont span {
        font-size: 16px;
    }

    .contact-2info {
        font-size: 12px;
        margin-top: 20px;
        height: 30vw;
        line-height: 22px;
    }

    .contact-3item,
    .contact-3item:nth-child(n+4) {
        width: 100%;
        margin-top: 15px;
    }

    /*about-join-boshi*/
    .join-boshi {
        padding: 30px 0px;
    }

    .join-boshi .h3 {
        font-size: 18px;
    }

    .join-1info {
        line-height: 25px;
        margin-top: 2px;
    }

    .join-1info p {
        margin-top: 12px;
    }

    .join-2content {
        margin-top: 0px;
    }

    .join-2left {
        width: 150px;
        height: 92px;
    }

    .join-2left img {
        height: 100%;
        object-fit: cover;
    }

    .join-2right {
        width: calc(100% - 165px);
    }

    .join-2right span {
        font-size: 14px;
    }

    .join-2right p {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        line-height: 20px;
        font-size: 12px;
        margin-top: 5px;
    }

    .join-2right em {
        margin-top: 1.2vw;
        font-size: 12px;
    }

    .join-boshi .news-page {
        margin-top: 30px;
    }

    /*about-join-zhaoxian*/
    .zx {
        padding: 30px 0px;
    }

    .zx .h3 {
        font-size: 18px;
    }

    .zx-1 {
        margin-top: 10px;
    }

    .zx-nav span {
        margin: 0px 5px;
        width: 120px;
        height: 36px;
        line-height: 36px;
    }

    .zx-1item {
        width: 100%;
        margin-top: 15px;
    }

    .zx-2 {
        margin-top: 0px;
    }

    .zx-2item {
        width: 100%;
        margin-top: 15px;
    }

    .zx .news-page {
        margin-top: 30px;
    }

    /*about-join-zhaoxian-detail*/
    .zx-detail {
        padding: 30px 0px;
    }

    .zp-1 {
        height: 32vw;
    }

    .zp-1ver span {
        font-size: 18px;
    }

    .zp-1ver p {
        font-size: 14px;
    }

    .zp-2 {
        margin-top: 20px;
    }

    .zp-2item .txt2,
    .zp-2item select,
    .zp-2item .txt3 {
        margin-top: 15px;
        width: 100%;
        padding: 0px 20px;
    }

    .zp-3 {
        margin-top: 30px;
    }

    .zp-2des {
        margin-top: 40px;
    }

    .zp-5 {
        margin-top: 20px;
    }

    /*solve*/
    .solve-nav {
        height: 60px;
        overflow-x: auto;
    }

    .solve-nav ul {
        width: 1050px;
    }

    .solve-1 {
        margin: 30px auto 0px;
    }

    .solve-1 .h3 {
        font-size: 18px;
    }

    .solve-2 {
        margin: 30px auto 0px;
        padding-bottom: 30px;
    }

    .solve-2 .h3 {
        font-size: 18px;
    }

    .solve-2left {
        width: 100%;
    }

    .solve-2right {
        float: left;
        position: relative;
        box-sizing: border-box;
        padding: 20px 0px;
        width: 100%;
    }

    .solve-2right span {
        font-size: 18px;
    }

    .solve-2info {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
    }

    .solve-2more em {
        width: 110px;
        height: 36px;
        line-height: 36px;
    }

    .solve-3 {
        padding: 30px 0px;
    }

    .solve-3 .h3 {
        font-size: 18px;
    }

    .solve-3content {
        margin-top: 20px;
    }

    .solve-3content .swiper-slide samp {
        height: 64vw;
    }

    .solve-3content .swiper-button-prev {
        left: 10px;
    }

    .solve-3content .swiper-button-next {
        right: 10px;
    }

    /*solve-detail*/
    .solve-4right .h3 {
        font-size: 18px;
    }

    .solve-5 ul li {
        width: 100%;
        margin-top: 10px !important;
        margin-right: 0px !important;
    }

    .solve-5 ul li:nth-child(3n) {
        margin-right: 0%;
    }

    .solve-5 ul li:nth-child(2n) {
        margin-right: 0%;
    }

    .solve-7pannel {
        padding: 20px 0px;
    }

    .solve-7content {
        margin-top: 10px;
    }

    .solve-7pannel .h4 {
        font-size: 18px;
    }

    .solve-7pannel ul {
        margin-top: 0px;
    }

    .solve-7pannel ul li {
        width: 100%;
        margin-top: 10px;
        height: 40px;
        line-height: 40px;
        padding: 0px 15px;
    }

    .solve-7content {
        font-size: 13px;
    }

    .solve-7pannel ul li a {
        padding: 0px;
        height: 40px;
        line-height: 40px;
    }

    .solve-7pannel ul li span {
        width: 89%;
        background-size: 14px;
        font-size: 12px;
    }

    .solve-7pannel ul li em {
        background-size: 15px;
    }

    /*product*/
    .product {
        padding: 20px 0px 30px;
    }

    .pro-left {
        width: 100%;
        top: 0px;
        position: relative;
        max-height: 200px;
    }

    .pro-center {
        width: calc(100% - 20px);
    }

    .pro-right {
        width: 100%;
        margin-top: 30px;
    }

    .pro-li samp {
        height: 32vw;
    }

    .pro-form {
        width: 100%;
    }

    /*product-info*/
    .pro-1 {
        padding: 30px 0px;
    }

    .pro-1left .h3 {
        font-size: 18px;
    }

    .pro-1more a {
        width: 50%;
        height: 36px;
        line-height: 36px;
        margin-right: 10px;
        margin-bottom: 20px;
    }

    .pro-1nav {
        height: 28vw;
    }

    .pro-2 {
        margin-top: 10px;
    }

    .pro-2 ul li {
        font-size: 14px;
    }

    .pro-3td,
    .pro-3app {
        padding: 20px 0px;
        font-size: 14px;
    }

    .pro-3left {
        width: 100%;
    }

    .pro-3model span {
        font-size: 18px;
    }

    .pro-3ct {
        margin-top: 20px;
    }

    .pro-3right {
        width: 100%;
        margin-top: 20px;
        transform: translateX(0);
    }

    .pro-3rel {
        margin: 20px auto;
    }

    .pro-3des {
        margin-top: 20px;
    }

    .pro-3small samp {
        width: 7vw;
        height: 7vw;
    }

    .pro-3small .pro-3res {
        margin-left: 11px;
    }

    .pro-3small.active samp::before {
        border: 2px #006ab7 solid;
    }

    .pro-3small .pro-3res span {
        font-size: 12px;
    }

    .pro-3small .pro-3res em {
        font-size: 10px;
    }

    .pro-3rel samp {
        height: 24vw;
    }

    .pro-3rel .swiper-button-prev {
        left: 10px;
    }

    .pro-3rel .swiper-button-next {
        right: 10px;
    }

    .pro-3video {
        margin: 20px auto;
        padding-bottom: 70px;
    }

    .pro-3item samp {
        height: 28.58vw;
    }

    .pro-3item samp em {
        width: 9vw;
        height: 9vw;
    }

    .pro-3video .swiper-button-prev {
        left: 30%;
        top: auto;
        bottom: 20px;
    }

    .pro-3video .swiper-button-next {
        right: 30%;
        top: auto;
        bottom: 20px;
    }

    /*download*/
    .down-1 .txt4 {
        width: 84%;
    }

    .down-1icon {
        width: 49%;
        margin-right: 2% !important;
        margin-top: 10px;
        height: 26px;
        line-height: 26px;
    }

    .down-1icon:nth-child(2n) {
        margin-right: 0px !important;
    }

    .down-1icon span {
        font-size: 12px;
        margin-left: 5px;
    }

    .down-1icon samp {
        width: 14px;
    }

    .down-2content {
        margin-top: 10px;
    }

    .down-2 .h3 {
        font-size: 18px;
        margin-top: 30px;
    }

    .down-2content ul li {
        width: 100%;
        margin-top: 15px;
        height: 40px;
        line-height: 40px;
        padding: 0px 20px;
    }

    .down-2content ul li span {
        background-size: 14px;
        font-size: 14px;
        padding-left: 25px;
    }

    .down-2content ul li em {
        background-size: 16px;
    }

    .down-3content {
        padding-bottom: 30px;
        margin: 20px auto 0px;
    }

    .down-3item span {
        font-size: 14px;
        padding: 12px 5px;
    }

    .down-3item samp {
        height: 53.84vw;
    }

    .down-3item samp em {
        width: 10vw;
        height: 10vw;
    }

    .down-3content .swiper-button-prev {
        left: 10px;
        opacity: 0.5;
    }

    .down-3content .swiper-button-next {
        right: 10px;
        opacity: 0.5;
    }

    .down-4 {
        padding: 30px 0px;
    }

    .down-4 .h3 {
        font-size: 18px;
    }

    .down-4 select,
    .down-4 .txt5 {
        width: 100%;
        margin-top: 10px;
    }

    .down-4 form {
        margin-top: 0px;
    }

    .down-4bt input {
        width: 150px;
        height: 44px;
        line-height: 44px;
    }

    /*touzizhe*/
    .tz-1 {
        padding: 30px 0px;
    }

    .tz-2 {
        padding: 30px 0px;
    }

    .tz-2 .h3 {
        font-size: 18px;
    }

    .tz-2 ul {
        margin-top: 20px;
    }

    .tz-2 ul li {
        width: 120px;
        height: 36px;
        line-height: 36px;
        margin: 0px 5px;
    }

    .tz-2 ul li a {
        font-size: 14px;
    }

    .tz-2content {
        margin-top: 10px;
    }

    .tz-2item {
        width: 100%;
        margin-top: 10px;
    }

    .tz-2item a {
        padding: 10px;
    }

    .tz-2left {
        padding-right: 10px;
    }

    .tz-2left span {
        font-size: 16px;
    }

    .tz-2left em {
        font-size: 12px;
    }

    .tz-2right {
        width: calc(100% - 69px);
    }

    .tz-2right span,
    .tz-2right em {
        font-size: 12px;
        line-height: 20px;
    }

    .tz-3 {
        padding: 30px 0px;
    }

    .tz-3 .h3 {
        font-size: 18px;
    }

    .tz-3content {
        margin-top: 10px;
    }

    .tz-3item {
        width: 100%;
        margin-top: 15px;
        height: 35vw;
    }

    .tz-map {
        height: 360px;
    }

    .bottom-center {
        transform: scale(0.5) translate(-53px, 52px);
    }

    /*server*/
    .server-1 {
        padding: 30px 0px;
    }

    .server-1 .h3 {
        font-size: 18px;
    }

    .server-1center {
        display: block;
    }

    .server-1left {
        width: 100%;
        margin-top: 20px;
    }

    .server-1cont {
        height: 76vw;
        padding: 15px;
    }

    .server-1cont .mCSB_scrollTools {
        width: 4px !important;
    }

    .server-1right {
        width: 100%;
        margin-top: 20px;
    }

    .server-2 {
        padding: 30px 0px;
    }

    .server-2center {
        display: block;
        width: 90%;
    }

    .server-2left,
    .server-2right {
        width: 100%;
    }

    .server-2right .h3 {
        font-size: 18px;
    }

    .server-2info {
        line-height: 25px;
        font-size: 12px;
    }

    .server-2des {
        margin-top: 20px;
    }

    .server-3 {
        padding: 30px 0px;
    }

    .server-3 .h3 {
        font-size: 18px;
    }

    .server-3 ul li {
        width: 100%;
        margin-top: 15px;
        padding: 0px 20px;
        height: 40px;
        line-height: 40px;
    }

    .server-3 ul li span {
        width: 89%;
        font-size: 14px;
        background-size: 14px;
        padding-left: 20px;
    }

    .server-3 ul li em {
        background-size: 16px;
    }

    .server-3more {
        width: 150px;
        margin: 30px auto 0px;
        height: 40px;
        line-height: 40px;
    }

    .server-4 {
        padding: 30px 0px;
    }

    .server-4 .h3 {
        font-size: 18px;
    }

    .server-4nav {
        height: 40px;
    }

    .server-4 ul li {
        padding: 0px 0px 5px;
    }

    .server-4 ul li.active {
        padding-bottom: 7px;
    }

    .server-4item {
        width: 100%;
        margin-top: 15px;
    }

    .server-4item samp {
        height: 45.84vw;
    }

    .server-4item span {
        font-size: 12px;
        line-height: 20px;
    }

    .server-4more {
        width: 150px;
        margin: 30px auto 0px;
        height: 40px;
        line-height: 40px;
    }

    .bread-center {
        font-size: 12px;
    }

    .banner-info {
        display: none;
    }
}

.pro-3ul {
    width: 75%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    box-sizing: border-box;
    margin: 0 auto;
    padding: 90px 0 160px;
}

.pro-3li {
    width: 100% !important;
    overflow: hidden;
    background: #fff;
    margin-top: 25px;
    box-shadow: 0px 0px 12px 4px rgba(0, 0, 0, 0.02);
    line-height: 40px;
    display: block;
    overflow: hidden;
    box-sizing: border-box;
    padding: 10px 40px;
    font-size: 20px;
    color: #353535;
}

.pro-3li span {
    float: left;
    width: 85%;
    height: 100%;
    overflow: hidden;
    box-sizing: border-box;
    padding-left: 40px;
    background: url("../images/icon-94.png") no-repeat left center;
    font-size: 20px;
    color: #353535;
}

.pro-3li span a {
    color: #353535;
}

.pro-3li em {
    float: right;
    width: 21px;
    height: 100%;
    overflow: hidden;
    background: url("../images/icon-95.png") no-repeat center;
}

.pro-3li em a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
}

.pro-3li:hover {
    box-shadow: 0px 0px 12px 4px rgba(0, 0, 0, 0.06);
}

.pro-3li:hover span a {
    color: #006ab7;
}

.pro-3li:hover em {
    transform: translateY(3px);
}

@media screen and (max-width:1440px) {
    .pro-3ul {
        margin: 80px auto;
    }
}

@media screen and (max-width:1280px) {
    .pro-3ul {
        margin: 50px auto;
    }
}

@media screen and (max-width:1000px) {
    .pro-3ul {
        margin: 40px auto;
        width: 90%;
    }
}

@media screen and (max-width:768px) {
    .pro-3ul {
        margin: 30px auto;
    }

    .pro-3li {
        height: 40px;
        line-height: 40px;
        padding: 0px 15px;
        font-size: 14px;
    }

    .pro-3li span {
        font-size: 12px;
        width: 89%;
        background-size: 14px;
        padding-left: 26px;
    }

    .pro-3li em {
        background-size: 15px;
    }
}

.zx-prop {
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0px;
    top: 0px;
    z-index: 2000;
    background: rgba(0, 0, 0, 0.7);
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.6s ease 0s;
    -moz-transition: all 0.6s ease 0s;
    -ms-transition: all 0.6s ease 0s;
    -o-transition: all 0.6s ease 0s;
    transition: all 0.6s ease 0s;
}

.zx-prop.zx-prop-active {
    opacity: 1;
    visibility: visible;
}

.zx-center {
    width: 60%;
    overflow: hidden;
    background: #fff;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    padding-bottom: 30px;
}

.zx-close {
    width: 30px;
    height: 30px;
    position: absolute;
    right: 20px;
    top: 20px;
    transform: rotate(45deg);
    z-index: 12;
    cursor: pointer;
}

.zx-close:before {
    width: 70%;
    height: 2px;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: #222;
}

.zx-close:after {
    width: 2px;
    height: 70%;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: #222;
}

.zx-close:hover {
    transform: rotate(135deg);
}

.zx-center .h3 {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 26px;
    font-weight: bold;
    color: #333;
    position: relative;
    padding-bottom: 15px;
    margin-top: 50px;
}

.zx-center .h3:before {
    width: 60px;
    height: 4px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    background: #006ab7;
}

.zx-center form {
    width: 90%;
    overflow: hidden;
    margin: 20px auto 0px;
}

.zx-g {
    width: 100%;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.zx-g select,
.zx-g .txt5 {
    width: 32%;
    overflow: hidden;
    box-sizing: border-box;
    margin-top: 20px;
    border: 1px #e3e3e3 solid;
    height: 40px;
    line-height: 40px;
    background: #fff;
    padding: 0px 20px;
    font-size: 14px;
    color: #666;
}

.zx-g .txt5::placeholder {
    color: #666 !important;
    opacity: 1;
}

.zx-g .txt5::-webkit-input-placeholder {
    color: #666 !important;
    opacity: 1;
}

.zx-g .txt5::-ms-input-placeholder {
    color: #666 !important;
    opacity: 1;
}

.zx-g .txt5::-moz-placeholder {
    color: #666 !important;
    opacity: 1;
}

.zx-g select {
    width: 100%;
    background: url("../images/icon-108.png") no-repeat 95% center;
}

.zx-g textarea {
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    margin-top: 20px;
    border: 1px #e3e3e3 solid;
    background: #fff;
    padding: 20px;
    font-size: 14px;
    color: #666;
    line-height: 24px;
    height: 180px;
}

.zx-g textarea::placeholder {
    color: #666 !important;
    opacity: 1;
}

.zx-g textarea::-webkit-input-placeholder {
    color: #666 !important;
    opacity: 1;
}

.zx-g textarea::-ms-input-placeholder {
    color: #666 !important;
    opacity: 1;
}

.zx-g textarea::-moz-placeholder {
    color: #666 !important;
    opacity: 1;
}

.zx-bt {
    width: 100%;
    overflow: hidden;
    padding-top: 30px;
}

.zx-bt input {
    width: 40%;
    height: 40px;
    line-height: 40px;
    display: block;
    margin: 0px auto;
    overflow: hidden;
    cursor: pointer;
    background: #006ab7;
    text-align: center;
    font-size: 14px;
    color: #fff;
}

.zx-bt input:hover {
    transform: translateY(-3px);
}

.zx-g select:hover,
.zx-g.txt5:hover,
.zx-g textarea:hover {
    border-color: #006ab7;
}

@media screen and (max-width:1440px) {
    .zx-center {
        width: 70%;
        padding-bottom: 24px;
    }

    .zx-center form {
        margin: 10px auto 0px;
    }
}

@media screen and (max-width:768px) {
    .zx-center .h3 {
        margin-top: 20px;
        font-size: 20px;
    }

    .zx-center .h3:before {
        width: 30px;
        height: 2px;
    }

    .zx-center {
        width: 90%;
        padding-bottom: 14px;
    }

    .zx-center form {
        margin: 10px auto 0px;
    }

    .zx-g select,
    .zx-g .txt5 {
        width: 100%;
        margin-top: 6px;
        height: 35px;
        line-height: 35px;
    }

    .zx-g textarea {
        margin-top: 6px;
        height: 90px;
    }

    .zx-bt {
        padding-top: 15px;
    }

    .zx-bt input {
        width: 100%;
    }
}